Asp.net jqueryui对话框+；验证

单击保存时使用jQuery验证验证jQuery UI对话框时遇到问题

下面是我创建Jquery对话框的代码。它从目标a href URL加载对话框：

$(document).ready(dialogForms);

function dialogForms() {
  $('a.dialog-form').click(function() {
    var a = $(this);
    $.get(a.attr('href'),function(resp){
      var dialog = $('<div>').attr('id','formDialog').html($(resp).find('form:first').parent('div').html());
      $('body').append(dialog);
      dialog.find(':submit').hide();
      dialog.find('#return').hide();
      dialog.dialog({
        title: a.attr('title') ? a.attr('title') : '',
        modal: true,
        buttons: {
          'Save': function() {submitFormWithAjax($(this).find('form'));},
          'Cancel': function() {$(this).dialog('close');}
        },
        close: function() {$(this).remove();},
        width: 'auto'
      });
    }, 'html');
    return false;
  });
}

function submitFormWithAjax(form) {
    form = $(form);
    $.ajax({
        beforeSend: function(data) {
            //alert("beforesend");
            form.validate();
        },
        url: form.attr('action'),
        data: form.serialize(),
        type: (form.attr('method')),
        dataType: 'text',
        error: function(data) {
            alert(data);
            $('#result').html(data);
        },
        success: function(data) {
            //alert("success");
            $('#result').html(data);
            setTimeout("reloadPage()", 500);
        }
    });
  return false;
}

---

beforeSend

在

submitFormWithAjax函数中是否存在问题，
$（“#事件_表单”）。验证
或其中的
submitHandler:function（form）
？任何帮助都将不胜感激。
初始化jQueryUI对话框时，它会修改DOM，整个对话框将从页面中的位置取出，并插入到
标记之前。你可以通过Firebug看到这一点。这会导致验证出现问题，因为现在表单为空。要解决此问题，请在对话框的打开事件中将其附加到窗体。这听起来很奇怪，但相信我，它是有效的：）

编辑：

对此采取了稍微不同的方法。我需要重用我的模态表单，所以一旦jquery“创建”模态，我就将其追加：

    $("#mdl_Subject").dialog({
    autoOpen: false,
    show: "drop",
    hide: "drop",
    modal: true,
    create: function () {
        $(this).parent().appendTo($('#aspnetForm'));
    }
});

当元素无效时，您能告诉我正在将
.error
类添加到元素中吗？我尝试了这个，但它不起作用。对话框现在不显示。只是澄清一下，调用jquery对话框并保存函数dialogForms（）（调用页面）的页面不包含任何表单元素。目标页面包含一个事件表单和jquery验证脚本。这些位置适合他们吗？appendTo仍然是目标事件表单吗？我编辑了答案以添加我使用的结构，对话框应用于div，验证应用于表单。对话框被追加回表单中。所有这些，包括jquery代码，都在一个单独的文件中，并在onclick（）事件中加载到我页面上的emty div中。已提交编辑，以通过建议修复模式问题。Breake:Fixed:Thank you@wtjones这帮我搞定了：
appendTo:$（“#form1”）
提交了相同的模式修复，以使用此处建议的appendTo选项：。我认为只有较新的jQueryUI版本（>=1.10.2）会受到影响。
dialog.dialog({
    title: a.attr('title') ? a.attr('title') : '',
    modal: true,
    buttons: {
      'Save': function() {submitFormWithAjax($(this).find('form'));},
      'Cancel': function() {$(this).dialog('close');}
    },
    close: function() {$(this).remove();},
    open: function(){
        $(this).parent().appendTo($('#event_form'));
    },
    width: 'auto'
  });

<form id='event_form'>
  <div id="dialog" title="DialogTitle"> 
  </div>
</form>

    $("#mdl_Subject").dialog({
    autoOpen: false,
    show: "drop",
    hide: "drop",
    modal: true,
    create: function () {
        $(this).parent().appendTo($('#aspnetForm'));
    }
});