我正在使用AJAX提交表单,并希望在页面上显示信息摘要,以便用户可以在提交之前确认信息。我有麻烦得到的结果显示在多行。有什么最好的方法吗?
下面是PHP:
$return['message'] = 'First Entry: ' . $_POST['Name1'] . ' ' . 'Second Entry: ' . $_POST['Name2'] . ' ' . 'Third Entry: ' . $_POST['Name3'];
echo json_encode($return);
这是jQuery:
$("#mark-form").validate({
submitHandler: function(form) {
$(form).ajaxSubmit({
type: "POST",
data: {
"Name1" : $('#Name1').val(),
"Name2" : $('#Name2').val(),
"Name3" : $('#Name3').val()
},
dataType: 'json',
url: './includes/ajaxtest3.php',
error: function() {alert("Error");},
success:
function(data) {
$('<div id="output2"></div>').insertAfter($('#agreement-information'));
$('#output2').html(data.message).show(500);
$('#ouput2').append(data);
},
});
return false;
},
errorPlacement: function(error,element) {
return true;
},
rules: {
"Name1": {
required: true,
}
}
});
你可以像这样传输JSON编码的HTML换行符:
$return['message'] = 'First Entry: ' . $_POST['Name1'] . '<br /> ' . 'Second Entry: ' . $_POST['Name2'] . '<br /> ' . 'Third Entry: ' . $_POST['Name3'];
echo json_encode($return);
或将换行符('n)转换为换行符标记。
更好的方法是将这种处理留给客户端,例如返回一个消息数组:$return['message'] = array();
$return['message'][] = 'First Entry: ' . $_POST['Name1'];
$return['message'][] = 'Second Entry: ' . $_POST['Name2'];
$return['message'][] = 'Third Entry: ' . $_POST['Name3'];
echo json_encode($return);
并将处理留给客户端(可能客户端希望稍后用段落标签包装消息):
function(data)
{
$('<div id="output2"></div>').insertAfter($('#agreement-information'));
$('#output2').html(data.message.join('<br />')).show(500);
$('#ouput2').append(data);
}
通常您希望在数组上使用json_encode
。PHP数组的格式是:
$arr = array('foo' => 1, 'bar' => 2, 'baz' => 'test');
// you can probably just use $_POST here, i.e. $arr = $_POST
echo json_encode($arr);
处理data
变量的JavaScript应该是这样的
$('#id').html(data.foo + "<br />" + data.bar + "<br />" + data.baz);
这使您可以分段处理数据,而不是集中处理,因此更容易操作和解析。
您需要插入<br />
标签或插入'n
,然后将内容放在pre
标签中。记住,你是将这些内容注入到html DOM中,所以html规则仍然适用:-)
$return['message'] = 'First Entry: ' . $_POST['Name1'] . '<br />' . 'Second Entry: ' . $_POST['Name2'] . '<br />' . 'Third Entry: ' . $_POST['Name3'];