时间戳

首页 > 解决方案 > 无法使用相同的表单使用 php 和 ajax 调用插入和更新

php - 无法使用相同的表单使用 php 和 ajax 调用插入和更新

问题描述

我在一个页面中有很多表格。我想使用相同的表单来保存和编辑表单。我想使用 ajax 和 php 来保存和编辑记录，并希望在单击保存按钮后禁用保存按钮并启用编辑按钮，反之亦然。请帮我。

我有类似这样的形式。

<form id="a" onsubmit="return func();">
       <input type="text" name="fname">
       <input type="text" name="lname">
       <input type="text" name="email">
       <input type="submit" id="saveButton" value="save" style="height:40px;width:70px">
                           <input type="submit" id="editButton" value="edit" style="height:40px;width:70px">
      </form>

<script src="js/bootstrap.min.js" type="text/javascript"></script>
    <script>
 function func(){   
    $.ajax({
        url     : "registration_detail.php", // in this you got serialize form data via post request
        type    : 'POST',
        data    : $('#a').serialize(),
        success: function(response){
            console.log(response);            
        }
    });
     return false;
}
function func(){   
    $.ajax({
        url     : "update_application.php", // in this you got serialize form data via post request
        type    : 'POST',
        data    : $('#a').serialize(),
        success: function(response){

            console.log(response);            
        }
    });
     return false;
}

    </script>

    <script type="text/javascript">
        $(document).ready(function(){
  $("#saveButton").click(function(){
 $("#saveButton").attr("disabled", true);
   $("#editButton").attr("enabled", true);
  });
  $("#editButton").click(function(){
  $("#editButton").attr("disabled", true);
  $("#saveButton").attr("enabled", true);
  });
});
    </script>

标签： phpjqueryajax

解决方案

请检查您的脚本，您已经创建了两个同名的函数。

<form id="a">
       <input type="text" name="fname">
       <input type="text" name="lname">
       <input type="text" name="email">
       <input type="button" id="saveButton" onclick="funcAdd();"value="save" style="height:40px;width:70px">
       <input type="button" id="editButton" onclick="funcUpdate()" value="edit" style="height:40px;width:70px">
      </form>



<script type="text/javascript">
        $(document).ready(function(){
  $("#saveButton").click(function(){
 $("#saveButton").attr("disabled", true);
   $("#editButton").attr("disabled", false);
  });
  $("#editButton").click(function(){
  $("#editButton").attr("disabled", true);
  $("#saveButton").attr("disabled", false);
  });
});
    </script>

<script>
 function funcAdd(){   
    console.log("in Add");
        $.ajax({
        url     : "registration_detail.php", // in this you got serialize form data via post request
        type    : 'POST',
        data    : $('#a').serialize(),
        success: function(response){
            console.log(response);            
        }
    });
     return false;
}
function funcUpdate(){   
    console.log("in update");   
    $.ajax({
        url     : "update_application.php", // in this you got serialize form data via post request
        type    : 'POST',
        data    : $('#a').serialize(),
        success: function(response){

            console.log(response);            
        }
    });
     return false;
}

</script>

推荐阅读