Jquery标记输入需要Jquery验证

Question

我有一个表单(ASP。. NET MVC)和两个令牌输入文本框。我还使用jquery.validate()函数来验证这两个字段都是必需的。

我的问题是，所需的规则不适用于两个tokeninput字段的第一个(它是哪一个并不重要;我测试了翻转这两个字段。

我确保设置ignore = ''允许隐藏字段，因为tokeninput基本上将字段更改为无序列表和隐藏输入字段。

这真的很奇怪，但我真的想需要这两个字段。什么好主意吗?

下面是我的代码:

HTML代码:

<form id="SendPOSettingsForm" method="post" name="SendPOInfo" action="/po/SendPOToVendor/">
  <div>
    <table cellpadding="2">
      <tr>
        <td><input type="checkbox" class="sendviagroup" name="sendViaEmail" id="sendViaEmail" value="Y" @emailChecked /> <b>Email To:</b> &nbsp;&nbsp;&nbsp;</td>
        <td>
          <input type="text" name="sendPOEmailTo" id="sendPOEmailTo" style="font-family: arial; font-size:11px;"  />
          <input type="hidden" name="sendPOEmailTo_List" id="sendPOEmailTo_List" value="@emailTo" />
        </td>
      </tr>
      <tr>
        <td><input type="checkbox" class="sendviagroup" name="sendViaFax" id="sendViaFax" value="Y" onchange="UpdateAttnVisibility(this.checked);" @faxChecked /> <b>Fax To:</b> &nbsp;&nbsp;&nbsp;</td>
        <td>
          <input type="text" name="sendPOFaxTo" id="sendPOFaxTo" style="font-family: arial; font-size:11px;" />
          <input type="hidden" name="sendPOFaxTo_List" id="sendPOFaxTo_List"  value="@faxTo" />
        </td>
      </tr>
      <tr>
        <td><b>Subject:</b> &nbsp;&nbsp;&nbsp;</td>
        <td><input type="text" id="sendSubject" name="sendSubject" style="font-family: arial; font-size:11px; width:600px; height:25px;" /></td>
      </tr>
      <tr>
        <td valign="top"><b>Message:</b> &nbsp;&nbsp;&nbsp;</td>
        <td><textarea rows="10" cols="60" id="sendBody" name="sendBody" style="font-family: arial; font-size:11px;"></textarea></td>
      </tr>
    </table>
  </div>
  <div class="actions">
    <br />
    <input type="submit" id="bSendPO" value="&nbsp;&nbsp;Send&nbsp;&nbsp;" class="orangeButton2" style="font-weight:bold;" />
    &nbsp;&nbsp;
    <input type="button" value="&nbsp;&nbsp;Cancel&nbsp;&nbsp;" onclick="CancelSendPO();" class="orangeButton2" style="font-weight:bold;" />
    <ul class="errorclass" id="errorsummary"></ul>
  </div>
</form>

脚本代码:

$("#sendPOEmailTo").tokenInput("/Admin/Cron/GetVendorContactEmails.aspx?v=" + vendorNo, {
  theme: "facebook",
  preventDuplicates: true,
  allowFreeTagging: true
});
$("#sendPOFaxTo").tokenInput("/Admin/Cron/GetVendorContactFaxes.aspx?v=" + vendorNo, {
  theme: "facebook",
  preventDuplicates: true,
  allowFreeTagging: true
});
var formValidator = $("#SendPOSettingsForm").validate({
  ignore: "",
  rules: {
    sendPOFaxTo: {
      required: "#sendViaFax:checked" //only required if sendViaFax is checked
    },
    sendPOEmailTo: {
      required: "#sendViaEmail:checked" //only required if sendViaEmail is checked
    },
    sendSubject: {
      required: true
    },
    sendViaEmail: {
      require_from_group: [1, ".sendviagroup"]
    },
    sendViaFax: {
      require_from_group: [1, ".sendviagroup"]
    }
  },
  submitHandler: function (form) {
    //alert("is successful, no problems");
    form.submit();
  }
});

测试时，选中"FAX"复选框，但将"FAX TO"文本框留空即可。这给了我一个错误消息。然而，选中"EMAIL"复选框，但留下空白的"EMAIL TO"文本框提交表单，没有给我一个错误!如果我改变HTML &将两个传真输入放在email输入之前，则fax TO (sendPOFaxTo)所需规则失效，email (sendPOEmailTo)所需规则生效。

有什么建议吗?

Answer 1

Quote OP:

"如果我改变HTML &将两个传真输入放在电子邮件输入之前，则fax TO (sendPOFaxTo)所需规则失效，而email (sendPOEmailTo)所需规则生效。"

您正在描述require_from_group方法的已知错误/问题的症状，该错误/问题导致页面上的某些其他输入被忽略，具体取决于它们的位置。

解决办法是确保你使用的是最新版本的jQuery验证插件和它的additional-methods.js文件，这是1.11.1。

---

另外，禁用ignore选项的正确方法是，不将其设置为''，而是将其设置为[]。请看这个答案:https://stackoverflow.com/a/8565769/594235

ignore: []