Question

我正在使用php mysql插入到数据库中并且工作正常，但是bootstrap模式不允许我提交另一个项目。按钮仍然表示插入，最后插入的数据仍显示在输入中。

我想多次插入，因为这会成为更大的编辑表单的一部分。这是在编辑表单提交按钮之外：

 <div id="add_data_Modal" class="modal fade" tabindex="-1" role="dialog">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-header">
 <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
 <h4 class="modal-title">Add A New Item</h4>
 </div>
 <div class="modal-body">
 <form method="post" id="insert_form">
 <input type="hidden" name="job_id" id="job_id" value="<?php echo $job_id;?>">
 <input type="hidden" class="form-control" id="job_mat_qty" name="job_mat_qty" value="1"  />
 <div class="form-group">
 <label for="job_mat_desc" class="col-sm-2 control-label">Description</label>
 <div class="col-sm-10">
 <textarea class="form-control editors" id="job_mat_desc"  name="job_mat_desc" autocomplete="off" placeholder="Enter item title and / or description" />
 </textarea>
 </div>
 </div>
 <div class="form-group">
 <label for="job_mat_cost" class="col-sm-2 control-label">Price</label>
 <div class="col-sm-10">
 <div class="input-group input-group"> <span class="input-group-addon"><?php echo CURRENCY ?></span>
 <input type="text" class="form-control calculate invoice_product_price txt" autocomplete="off" id="job_mat_cost" name="job_mat_cost" aria-describedby="sizing-addon1" placeholder="0.00"  />
 </div>
 </div>
 </div>
 <div class="form-group">
 <div class="col-sm-10"> </div>
 </div>
 </div>
 <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<input type="submit" name="insert" id="selected" value="Insert"     class="btn btn-success" />
</div>
</form>
</div>
</div>
</div>


$(document).on('click', '.delete-rows', function(){
        var id = $(this).attr("id");
        if (confirm("Are you sure you want to delete this Item?")) {
            $.ajax({
                type: "POST",
                url: "job_remove_material_new.php",
                data: ({
                    id: id
                }),
                cache: false,
                success: function(html) {
                    $(".delete_mem" + id).fadeOut('slow');
                }
            });
        } else {
            return false;
        }
    });



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

  if($('#job_mat_desc').val() == "")  
  {  
  alert("Description is required");  
  }  

  else  
  {  
  $.ajax({  
  url:"add_material.php",  
  method:"POST",  
  data:$('#insert_form').serialize(),
  cache: false,  
  beforeSend:function(){  
  $('#insert').val("Inserting");  
  },  
  success:function(data){  
  $('#insert_form')[0].reset();  
  $('#add_data_Modal').modal('hide'); 
  $('#invoice_table').html(data);  
  }  

 });  
 $(function () {

 $(document).on("hidden.bs.modal", "#add_data_Modal", function () {
 $('#insert_form')[0].reset();
 });
 });
 }  
 });

抱歉，我不知道如何为此论坛正确添加此代码，所以请善待.... 感谢

Answer 1

你应该尝试这样

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

  if($('#job_mat_desc').val() == "")  
  {  
  alert("Description is required");  
  }  

  else  
  {  
  $.ajax({  
  url:"add_material.php",  
  method:"POST",  
  data:$('#insert_form').serialize(),
  cache: false,  
  beforeSend:function(){  
  $('#insert').val("Inserting");  
  },  
  success:function(data){  
  //$('#insert_form')[0].reset();  
  $('#insert_form input[type="text"],textarea').val(''); // here is change
  $('#add_data_Modal').modal('hide'); 
  $('#invoice_table').html(data);  
  }  

 });

在我的情况下，它会成功运作，所以我希望它会帮助你

bootstrap模式插入表单提交不会重置以添加另一个条目

1 个答案: