【发布时间】：2012-01-08 06:34:25
【问题描述】：
我是第一次使用 jquery post()，我不能简单地附加返回的数据。在我的情况下，数据只是我的操作调用的页面中的一个表格行。我有这个
$.post(mysaveurl , $("#installment_form").serialize(), "html")
.success(function(data){
$( "#paymentplantable table tbody" ).append( data );
$dialog.dialog( 'destroy' );
}).error(function(){
alert("Please ensure that all fields are populated.");
});
我的数据正在访问数据库，但对话框没有破坏。这意味着我要添加的行会终止流程。 注意： 上面我使用了“html”参数，我不确定它是否合法，因为我只看到示例中使用了 xml 和 json。然后我把它修改成了这个
$.post(mysaveurl , $("#installment_form").serialize())
.success(function(data){
$dialog.dialog( 'destroy' );
var content = $( data ).find( 'tr' );
$( "#paymentplantable table tbody" ).append( content );
}).error(function(){
alert("Please ensure that all fields are populated.");
});
它的工作原理是我正在获取我的数据，但是当我将表格行附加到现有表格时，单元格格式错误。如果我用萤火虫检查 DOM，表格在结构上是正确的，但是它没有显示为正确的表格行，所有数据都被“挤压”到左侧。
然后我觉得 HTML 没有正确传递，所以我使用了 jquery html() 方法如下
var content = $( data ).find( 'mydivwrapper' ).html();
其中 'mydivwrapper' 是放置在 tr 周围的 div，也通过返回的“数据”进入。这也是个坏主意。
请帮忙。
编辑：
我稍微改变了我的脚本。看这个
dataString = $("#installment_form").serialize();
$.ajax({
type: "POST",
url: mysaveurl,
data: dataString,
dataType: "text",
success: function(data) {
alert(data);
}
});
当我提醒返回的数据时，我得到了这个
<?xml version="1.0" encoding="UTF-8"?>
<html><tr><td>31</td><td>147.0</td><td>Monday 14 November, 2011</td><td style="height:20px; width:20px;" class="edit_in_table"/><td style="height:20px; width:20px;" class="remove" id="/starburst/invoices/removeInstallment/14/31"/></tr></html>
已解决： 我在操作中构建了表格行并将标记作为字符串返回。不知道为什么会发生上述行为。
另外，为了任何阅读这篇文章的人的利益，我在 jquery 对话框中发布我的表单时遇到了很大的困难。你看，我动态创建了对话框，它不在 DOM 中，我不得不调用 $("#mydialig").remove();让我的日期选择器每次都显示出来，并防止表单提交以前的值。希望对您有所帮助，这是最终代码。
function addInstallment(){
$("#newinstallment").live("click", function(){
var $dialog = $('<div></div>');
var mysaveurl = $(this).attr("saveurl");
$dialog.load($(this).attr("formurl"), function(){
$( "#mydatepicker" ).datepicker();
}).dialog({
title: 'Add new payment item',
width: 450,
modal: true,
buttons: {
Save: function() {
dataString = $("#installment_form").serialize();
$.ajax({
type: "POST",
url: mysaveurl,
data: dataString,
dataType: "text",
context: $(this),
success: function(data) {
$( "#paymentplantable table tbody" ).append(data);
var newremoveurl = "${removeinsturlNoIds}"+$("#paymentplantable tr:last td:last").attr("id");
$("#paymentplantable tr:last td:last").attr("id", newremoveurl);
$( this ).remove();
}
});
},
Cancel: function() {
$( this ).dialog( 'destroy' );
}
}
});
});
}
【问题讨论】：
标签： jquery jquery-dialog jquery-post jquery-append