javascript - 如果我想在 PHP 中编辑行，请更新查询插入

Question

我创建了一个页面，我可以在其中轻松更新或插入数据。它确实有效，但如果我单击编辑按钮，然后关闭模式，然后添加新数据，它会更新以前的数据而不是插入新行。但是如果我刷新一个页面，然后我更新一行，它就可以工作。我该如何解决这个问题？

index.php:

<form method="post" id="insert_form">
  <label><b>Name:</b></label>
  <input type="text" name="name" id="name" class="form-control" readonly required />
  <br />
  <label><b>Description:</b></label>
  <input type="text" name="hu" id="hu" class="form-control"></textarea>
  <br />
  <label><b>Cégek:</b></label>
  <select name="company[]" id="company" multiple>
  <?php
      while($row = $huResult2->fetch_array()) {
  ?>
      <option value="<?php echo $row['company_id'];?>"><?php echo $row['company_name'];?></option>
  <?php
      }
  ?>
  </select>
  <br/><br/>
  <input type="hidden" name="data_id" id="data_id" />
  <input type="submit" name="insert" id="insert" value="Insert" class="btn btn-success" />
</form>

<script>
  $('#add').click(function() {
    $('#insert').val("Insert");
    $('#insert_form')[0].reset();
    $('#company').multiselect('refresh');
    $('#name').removeAttr('readonly');
  });

  // Edit roles
  $(document).on('click', '.edit_data', function() {
    $("#company option").prop("selected", false);
    $("#name").attr('readonly', true);
    var data_id = $(this).attr("id");

    // Receive the current datas for the roles
    $.ajax({
      url: "fetchRole.php",
      method: "POST",
      data: {
        'data_id': data_id
      },
      dataType: "json",
      success: function(data) {
        $('#name').val(data.name);
        $('#hu').val(data.hu);
        $.each(data.companies, function(i, e) {
          $("#company option[value='" + e + "']").prop("selected", true);
        });
        $('#company').multiselect('refresh');

        $('#data_id').val(data.id);
        $('#insert').val("Update");
        $('#add_data_Modal').modal('show');
      }
    });
  });

  $('#insert_form').on("submit", function(e) {
    e.preventDefault();

    // Update and insert
    $.ajax({
      url: "insertRole.php",
      method: "POST",
      data: $('#insert_form').serialize(),
      beforeSend: function() {
        $('#insert').val("Updating...");
      },
      success: function(data) {
        $('#insert_form')[0].reset();
        $('#add_data_Modal').modal('hide');
        $('#role_table').html(data);
        location.reload();
      }
    });
  });
</script>

Answer 1

在关闭模式时做一件事使 data_id 字段值空白

 $('#myModal').on('hidden.bs.modal', function () {
  $("#data_id").val("");
 })

也许会有帮助

或者点击 add new 按钮做同样的事情

$('#add').click(function() {
    $('#insert').val("Insert");
    $('#insert_form')[0].reset();
    $('#company').multiselect('refresh');
    $("#data_id").val("");
    $('#name').removeAttr('readonly');
  });