jquery从对话框发布表单

我有一个js函数，它获取html从控制器创建新员工，将其插入表单标记（稍后用于.serialize（）），然后将此html插入createDialog div，并将此div显示为对话框

<div id="createDialog" style="display:none;">
</div>

$.get('/Employee/Create',
     function (html) {
        html = "<form id='createEmp'>" + html;
        html = html + "</form>";
        $("#createDialog").html(html);
        $("#createDialog").dialog({
            modal: true,
            width: 500,
            buttons: { "Save": function () { postEmployee(); } },
            close: function (ev, ui) { $(this).dialog('destroy'); }
        });
     });


    function postEmployee() {

        $.post('/Employee/Create',
        $("#createEmp").serialize(),
        function (html) {
            $('#reply').html(html);
        });
    }

$.get（“/Employee/Create”，
函数（html）{
html=”“+html；
html=html+“”；
$（“#createDialog”）.html（html）；
$（“#创建对话框”）.dialog({
莫代尔：是的，
宽度：500，
按钮：{“保存”：函数（）{postEmployee（）；}}，
关闭：函数（ev，ui）{$（this.dialog（'destroy'）；}
});
});
函数postEmployee（）{
$.post（“/Employee/Create”，
$（“#createEmp”）.serialize（），
函数（html）{
$（'#reply'）.html（html）；
});
}

这是可行的，但只有一次。在每一篇下一篇文章中，以前文章中的所有表单字段也会添加到当前文章中。 这个问题能解决吗

---

谢谢你

您还需要删除您创建的

元素，如下所示：

close: function (ev, ui) { $(this).dialog('destroy').empty(); }

$.get('/Employee/Create', function (html) {
  $("#createDialog").html(html).wrapInner("<form id='createEmp'> />");
  $("#createDialog").dialog({
      modal: true,
      width: 500,
      buttons: { "Save": postEmployee },
      close: function (ev, ui) { $(this).dialog('destroy').empty(); }
  });
});

您还可以通过以下方式使整个功能更简洁：

close: function (ev, ui) { $(this).dialog('destroy').empty(); }

$.get('/Employee/Create', function (html) {
  $("#createDialog").html(html).wrapInner("<form id='createEmp'> />");
  $("#createDialog").dialog({
      modal: true,
      width: 500,
      buttons: { "Save": postEmployee },
      close: function (ev, ui) { $(this).dialog('destroy').empty(); }
  });
});

$.get（'/Employee/Create'，函数（html）{
$（“#createDialog”）.html（html）.wrapInner（“/>”）；
$（“#创建对话框”）.dialog({
莫代尔：是的，
宽度：500，
按钮：{“保存”：postEmployee}，
关闭：函数（ev，ui）{$（this）.dialog（'destroy'）.empty（）；}
});
});

最好不要创建和销毁，而是创建然后打开和关闭

html

js

var$dialog=$（“#createDialog”）.dialog({
莫代尔：是的，
自动打开：错误，
宽度：500，
按钮：{“保存”：函数（）{postEmployee（）；}}，
关闭：函数（ev，ui）{$（this.dialog（'close'）；}
});
$.get（'/Employee/Create'，函数（html）{
html=”“+html；
html=html+“”；
$（“#createDialog”）.html（html）；
$dialog.dialog（“打开”）；
});
函数postEmployee（）{
$.post（“/Employee/Create”，
$（“#createEmp”）.serialize（），
函数（html）{
$（'#reply'）.html（html）；
});
}

$.get（“/Employee/Create”，
函数（html）{
var nodeContent=“+html+”；
$（“#createDialog”）.empty（）；
$（“#createDialog”）.html（nodeContent）；
$（“#创建对话框”）.dialog({
莫代尔：是的，
宽度：500，
按钮：{“保存”：函数（）{postEmployee（）；}}，
关闭：函数（ev，ui）{$（this.dialog（'destroy'）；}
});
});

使用来自malsup的优秀jquery表单插件：

成功时调用clearForm（）：

function postEmployee()
    $('#createEmp').ajaxSubmit({
        url: '/Employee/Create'
        , success: function(html){
            $('#reply').html(html);
            $('#createEmp').clearForm();
        }
    });
}

创建表单后调用resetForm（），以防止浏览器还原缓存的值

$('#createEmp').resetForm();

$('#createEmp').resetForm();