Question

我通过AJAX提交表单数据没有问题，并在单独的div中显示所有数据。

但是如何使用基于服务器响应的一些新信息更新表单本身？

就我而言，我有：

包含许多输入的表单，包括一组复选框
收集来自表单的数据（使用JQuery序列化）并通过Ajax发送到php脚本。
我需要为所选复选框附近的文字设置特定颜色。

我需要在客户端设置该颜色，但需要基于服务器端脚本。

当需要根据初始表单数据更新表单时，请解释正确的逻辑过程。

Answer 1

如果您使用的是jQuery，您将通过AJAX（post / get）发送数据，然后您将以纯文本/ json / xml格式（您的选择）从服务器脚本获取响应。在这种情况下，如果只需要返回颜色代码，则可以使用纯文本格式。获得响应后，您可以操作数据。

$.post("test.php", $('#form').serialize(),
function(returned_data_from_server_script) {
    $('some dom for color').css('color', returned_data_from_server_script);
});

Answer 2

服务器端，您可以像这样发回一个json编码变量。

echo json_encode( array('text_color', 'green') );

然后，在客户端，您可以在回调函数中访问此变量。

$.ajax({
   url: 'ajax/test.html',
   dataType: 'json', 
   data: $('yourform').serialize(), 
   success: function(data) {
      var color = data.text_color; 
      $('yourElement').css('color', color); 
   }
});

或者你可以发回一个类并将该类添加到元素中。

提交表单后更新表单字段

2 个答案: