通过ajax将表单数据发送到php文件

Question

在引导模式中有一个表单。首先我从一个包含唯一 id 的按钮获取数据属性，然后在表单保存按钮上设置该数据属性。这是脚本：

<script type="text/javascript">
  $('.alctskbtn').click(function(event) {
   var pr =  $(this).data('projct');
   $('.allocatetskmodal').find('.inputallacatetsk').attr('data-project', pr);
  });
  $('.inputallacatetsk').click(function(event) {
    event.preventDefault();
    /* Act on the event */
    var t = $(this);
    var proj = $(this).data('project');
    var url = $('#prjfrm').attr('action');

    $.post(url,{proj : proj}, function(value) {
     /*optional stuff to do after success */
     console.log("sent!");
   });
  });
</script>

我想将这个唯一的 id 连同表单数据一起发送到一个 php 文件中，但是在单击“保存”按钮后，引导模式一直卡住。这是 php 文件代码：

<?php

include 'connection.php';

$proj_id = $_POST['proj'];

if(isset($_POST['addtsk']))
{

  $tt = $_POST['tt'];
  $td = $_POST['td'];
  $tsd = $_POST['tsd'];
  $ted = $_POST['ted'];
  $tstat = $_POST['tstat'];

  $qry = "insert into task (project_id, task_name, task_duration, task_start_date, task_end_date, task_status, creation_date,is_active)
  values ($proj_id,'$tt','$td','$tsd','$ted','$tstat',now(),1)";

  $run = mysqli_query($con,$qry);

}
?> 

这是 Html 代码：

<!-- Add Task Modal -->
<div class="modal allocatetskmodal fade" id="add-tsk" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header add-prj">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title add-prj" id="myModalLabel">Add Task</h4>
      </div>
      <div class="modal-body add-prj">
          <form id="prjfrm" method="post" action="tskscript.php">
          <!-- <label>Project ID</label> <input id="pid" type="text" name="pid" placeholder="ID"> <br><br> -->
          <label>Task Title</label><input id="pt" type="text" name="tt" placeholder="Title" required> <br><br>
         <!--  <label>Task Description</label> <input id="pdescr" type="text" name="pdescr" placeholder="Description" required> <br><br> -->
          <label>Task Duration</label><input  id="pd" type="text" name="td" placeholder="Duration" required> <br><br>
          <label>Task Start Date</label><input id="psd" type="text" name="tsd" placeholder="Start Date" required> <br><br>
          <label>Task End Date</label><input id="ped" type="text" name="ted" placeholder="End Date" required> <br><br>
           <label>Task Status</label>
           <select id="tstat" name="tstat">
            <option value="Completed">Completed</option>
            <option value="Pending">Pending</option>
          </select>
      </div>
      <div class="modal-footer add-prj">
        <button type="submit" name="addtsk" class="btn btn-default add-prj inputallacatetsk">Save</button>
        <button name="close" type="button" class="btn btn-default add-prj" data-dismiss="modal">Close</button>

      </div>
      </form>
    </div>
  </div>
</div>

请指导我。谢谢！

Answer 1

在本说明中，您只发送项目价值

$.post(url,{proj : proj}, function(value) {.....

如果您需要发送模式数据，则应添加发布所需的值，例如：

 // seems that your tt field is with pt id so 
  your_tt =  $("#pt").val();
  .....

 $.post(url,
   {proj : proj,
    addtsk: your_addtsk,
    tt: your_tt,
    td : your_td,
    tsd : your_tsd,
    ted: your_ted,
    tstat: your_tstad
  }, function(value) {.....