PHP使用AJAX和DataTables发布数据

时间:2015-03-25 21:28:53

标签: javascript php jquery ajax json

提交表单时,我遇到了在服务器端PHP脚本中获取POST数据的问题。我把它缩小到一点JQuery / JavaScript,通过AJAX将JSON数据加载到DataTable中。

表格如下:

   <form class="form-horizontal" action="./scripts/lookup.php" method="post" role="form" id="lookupForm">
   <div class ="form-group">
      <label for="inputLookup" class="col-sm-2 control-label">Username</label>
      <div class="col-sm-10">
         <input type="text" class="form-control" id="inputLookup" name="lookup_name" placeholder="John.Doe" required/>
      </div>
   </div>
   <div class="form-group">
      <div class="col-sm-10 col-sm-offset-2">
         <input id="submitUserLookupBtn" name="submitUserLookup" type="submit" value="Lookup" class="btn btn-primary"/>
      </div>
   </div>
</form>

然后是剧本:

$("#lookupForm").submit(function (e) {
 e.preventDefault();
 $.ajax({
     type: 'POST',
     url: './scripts/lookup.php',
     dataType: 'json',
     success: function(s) {
      LUUTable.fnClearTable();
        for(var i = 0; i < s.length; i++) {
           LUUTable.fnAddData([
              s[i][0],
              s[i][1],
              s[i][2],
              s[i][3],
              s[i][4],
              s[i][5],
              s[i][6],
              s[i][7]
           ]);
        }
     },
     error: function(e) {
        if (e.responseText != '') {
           console.log("Error: " + e.responseText);
        } else {
           console.log("Warning: No data to return.");
        }
     }
 });
});

每当运行该代码片段时,PHP都不会获得POST数据,但是一旦我将脚本注释掉,POST数据就会被发送到服务器。但问题是,这段代码片段是我处理服务器返回的JSON数据的地方。

导致数据不发布的原因可能是什么?我可以如何进一步排除故障或缓解此问题?

非常感谢!

2 个答案:

答案 0 :(得分:2)

您要将数据两次发送到./script/lookup.php

<form class="form-horizontal" action="./scripts/lookup.php" method="post" role="form" id="lookupForm">

并在Ajax脚本中。将上面的行更改为

<form class="form-horizontal" role="form" id="lookupForm">

只需保留网址,然后在javascript中的ajax调用中输入:post。

答案 1 :(得分:0)

序列化表单数据并在AJAX中发送值:

$("#lookupForm").submit(function (e) {
 e.preventDefault();
 var formValues = $(this).serialize(); // serialize the form data
 $.ajax({
     type: 'POST',
     url: './scripts/lookup.php',
     data: formValues, // send serailized form data here
     dataType: 'json',