PHP Ajax通过Bootstrap模式更新MySQL数据

Question

I want to update my database using php ajax modal. When updating the relevant field { $('#main_id').val(data.id); } don't pass an id to the update query therefor an insertion occurs without executing the updating query. console log details when trying to update I tried to solve this but I couldn't. without updating the existing data it inserts a new record

here is my index.php

<?php  
$connect = mysqli_connect("localhost", "root", "", "ohmsp");  
$query = "SELECT * FROM tbl_main_category ORDER BY cat_Id DESC";  
$result = mysqli_query($connect, $query);  
?>  

  <div id="employee_table">  
    <table class="table table-bordered">  
     <tr> <th width="70%">Employee id</th> 
      <th width="70%">Employee Name</th>  
      <th width="15%">Edit</th>  
      <th width="15%">View</th>  
    </tr>  
    <?php  
    while($row = mysqli_fetch_array($result))  
    {  
     ?>  
     <tr> <td><?php echo $row["cat_Id"]; ?></td> 
      <td><?php echo $row["category_name"]; ?></td>  
      <td><input type="button" name="edit" value="Edit" id="<?php echo $row["cat_Id"]; ?>" class="btn btn-info btn-xs edit_data" /></td>  
      <td><input type="button" name="view" value="view" id="<?php echo $row["cat_Id"]; ?>" class="btn btn-info btn-xs view_data" /></td>  
    </tr>  
    <?php  
  }  
  ?>  
</table>  
</div>  
</div>  
</div>  
</body>  
</html>  
<div id="dataModal" class="modal fade">  
  <div class="modal-dialog">  
   <div class="modal-content">  
    <div class="modal-header">  
     <button type="button" class="close" data-dismiss="modal">&times;</button>  
     <h4 class="modal-title">Employee Details</h4>  
   </div>  
   <div class="modal-body" id="employee_detail">  
   </div>  
   <div class="modal-footer">  
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
   </div>  
 </div>  
</div>  
</div>  
<div id="add_data_Modal" class="modal fade">  
  <div class="modal-dialog">  
   <div class="modal-content">  
    <div class="modal-header">  
     <button type="button" class="close" data-dismiss="modal">&times;</button>  
     <h4 class="modal-title">PHP Ajax Update MySQL Data Through Bootstrap Modal</h4>  
   </div>  
   <div class="modal-body">  
     <form method="post" id="insert_form">  
      <label>Enter Employee Name</label>  
      <input type="text" name="category_name" id="category_name" class="form-control" />  
      <br />  

      <input type="hidden" name="main_id" id="main_id" />  
      <input type="submit" name="insert" id="insert" value="Insert" class="btn btn-success" />  
    </form>  
  </div>  
  <div class="modal-footer">  
   <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
 </div>  
</div>  
</div>  
</div>  
<script>  
 $(document).ready(function(){  
  $('#add').click(function(){  
   $('#insert').val("Insert");  
   $('#insert_form')[0].reset();  
 });  
  $(document).on('click', '.edit_data', function(){
    console.log('test')       
    var main_id = $(this).attr("id");
    console.log(main_id)    
    $.ajax({  
      url:"fetch.php",  
      method:"POST",  
      data:{main_id:main_id},  
      dataType:"json",  
      success:function(data){ 
        console.log(data)
        $('#category_name').val(data.category_name);  
        console.log(data.category_name)             
        $('#main_id').val(data.id); 
        console.log(data.id)                     
        $('#insert').val("Update");  
        $('#add_data_Modal').modal('show');  
      }  
    });  
  });  

insert.php

    <?php  
 $connect = mysqli_connect("localhost", "root", "", "ohmsp");  
 if(!empty($_POST))  
 {  
      $output = '';  
      $message = '';  
      $category_name = mysqli_real_escape_string($connect, $_POST["category_name"]);  

      if($_POST["main_id"] != '')  
      {  
           $query = "  
           UPDATE tbl_main_category   
           SET category_name='$category_name' WHERE cat_Id='".$_POST["main_id"]."'";  
           $message = 'Data Updated';  
      }  
      else  
      {  
           $query = "  
           INSERT INTO tbl_main_category(category_name)  
           VALUES('$category_name');  
           ";  
           $message = 'Data Inserted';  
      }  

fetch.php

  <?php  
 //fetch.php  
 $connect = mysqli_connect("localhost", "root", "", "ohmsp");  
 if(isset($_POST["main_id"]))  
 {  
      $query = "SELECT * FROM tbl_main_category WHERE cat_Id = '".$_POST["main_id"]."'";  
      $result = mysqli_query($connect, $query);  
      $row = mysqli_fetch_array($result);  
      echo json_encode($row);  
 }  
 ?>

Answer 1

You have Fetched the value from $('#main_id').val(data.id) instead of $('#main_id').val(data.cat_Id);

You have fetched value of id instead of cat_Id