无法获取Ajax更新表单以使用反序列化

时间:2016-09-20 22:10:32

标签: php jquery mysql ajax serialization

我正在尝试将一个表单的工作演示(包括mysql)放在一起,该表单使用jquery来序列化表单数据,并使用php来检索数据,以便将其传递给mysql查询。

表单似乎是正确发布数据但我不知道如何设置处理脚本看到$ _POST来反序列化数据,以便我可以将它传递给mysql。您可以在http://www.dottedi.biz/demo/code/ajax/serialize看到该演示。

我尝试过使用:

$data=unserialize($_POST['data']);

反序列化数据,但它返回空白。一个简单的print_r($ _POST);从表单返回数组数据。如果您测试演示,可以看到。建议好吗?

添加了信息 - script.js文件的内容:

$(document).ready(function() {
  $('form').submit(function(evt) {
    evt.preventDefault();
    $.each(this, function() {

      var input = $(this);
      var value = input.val();
      var column = input.attr('name');
      var form = input.parents('form');
      var linked_col = form.find('#associated').attr('name');
      var linked_val = form.find('#associated').val();

      // var serializedData = $(this).serialize(); 

      $("#Status").html( "" );

      $.ajax({
        url: "update.php",
        data: {
          val: value,
          col: column,
          id: linked_col,
          id_val: linked_val
        },
        type: "POST",
        success: function(html) {
          $("#Status").html( html );
        }

      });
    });
  });
});

9/22 - 缩短了script.js

$(document).ready(function() {
  $('form').submit(function(evt) {
    evt.preventDefault();
     $.each(this, function() {

      $("#Result").html( "" );

      $.ajax({
        url: "update.php",
        data: $('form').serialize(), // works to post data
        type: "POST",
        success: function(html) {         
          $("#Result").html( html );
        }

      });
    });
  }); 
});

评论 - 我进行了测试,似乎使用序列化发布了相同的数据,与创建变量如var serializedData = $(this).serialize()并发布变量,但这更短。

1 个答案:

答案 0 :(得分:0)

也许你应该

$('form').submit(function(evt) { 
 // Serialize the data in the form
var serializedData = $(this).serialize();
//send off serializedData in your ajax
 }

然后

php脚本将有

$data=json_decode($_POST['data']);

新方式

  $.ajax({
    url: "update.php",
    data: {'data': $('form').serialize()}, // works to post data
    type: "POST",
    success: function(html) {         
      $("#Result").html( html );
    }