Question

基本上，当单击模态创建的提交按钮，并调用jQuery（'＃FormName'）。submit（）时，它将运行验证，然后调用submitHandler中指定的方法。之后它要么创建一个新的模态div，要么隐藏表单，我不明白为什么。

我已调试它并注意到在submitHandler中的方法调用之后，形式.is（'：hidden'）= true，对于模态div也是如此。我很肯定我以前做过这个，但似乎无法弄清楚这次我做错了什么。奇怪的是这是一个模态div出现在屏幕上，但它完全没有内容。（即使在表格之外放入随机文本。这就像是一个全新的模态div）

以下是设置方法：

function setUpdateTaskDiv() {
  jQuery("#UpdateTaskForm").validate({
    errorLabelContainer: "#ErrorDiv",
    wrapper: "div",
    rules: {
      TaskSubject: {
        required: true
      }
    },
    messages: {
      TaskSubject: {
        required: 'Subject is required.'
      }
    },
    onfocusout: false,
    onkeyup: false,
    submitHandler: function(label) {
      updateTaskSubject(null);
    }
  }
);

 jQuery('#UpdateDiv').dialog({
    autoOpen: false,
    bgiframe: true,
    height: 400,
    width: 500,
    modal: true,
    beforeclose: function() {
    },
    buttons: {
    Submit: function() {
      jQuery('#UpdateTaskForm').submit();
    },
    Cancel: function() {
      ...
    }
  }
});

其中：

function updateTaskSubject(task) {
  //does nothing, it's just a shell right now
}

现在没有真正做任何事情。这是html：

<div id="UpdateDiv">
 <div id="ErrorDiv">
 </div>
 <form method="post" id="UpdateTaskForm" action="Calendar.html">
  <div>
    <div class="floatLeft">
      Date:
    </div>
    <div class="floatLeft">
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      Start Time:
    </div>
    <div class="floatLeft">
      <select id="TaskStartDate" name="TaskStartDate">
      </select>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      End Time:
    </div>
    <div class="floatLeft">
      <select id="TaskEndDate" name="TaskEndDate">
      </select>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <div class="floatLeft">
      Subject:
    </div>
    <div class="floatLeft">
      <textarea id="TaskSubject" name="TaskSubject" cols="30" rows="10"></textarea>
    </div>
    <div class="clear">
    </div>
  </div>
  <div>
    <input type="hidden" id="TaskId" value="" />
  </div>
  <div class="clear"></div>
 </form>
</div>

奇怪的发现

事实证明，我得到这个的所有例子都把重点放在模态本身上。例如，使用验证器将消息添加到错误div。（成功与否）如果不这样做，模态对话框显然认为它完成了它需要做的事情，只是隐藏了一切。不确定为什么，但为了阻止这种行为，必须将某种焦点分配给div本身内的某些东西。

Answer 1

你在DIV中有你的表格，这是你想要的吗？（我没有在表格后看到</div> ...）

<div id="UpdateDiv"> 
 <div id="ErrorDiv"> 
 </div>

也许应该是：

<div id="UpdateDiv"> 
 <div id="ErrorDiv"></div>
 </div>

jQuery验证在提交时隐藏或拆除jquery模式对话框

1 个答案: