Question

我有一个带有两个tokeninput文本框的表单（ASP.NET MVC）。我还使用jquery.validate()函数来验证这两个字段是否都是必需的。

我的问题是，所需规则不适用于两个tokeninput字段的 first （它与哪一个无关;我测试了翻转这两个字段。）。

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

这很奇怪，但我真的想要这两个领域。有什么想法吗？

这是我的代码：

HTML CODE：

<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();
  }
});

当我测试时，检查“传真”复选框但将“传真到”文本框留空是有效的。这给了我一个错误信息。但是，选中“EMAIL”复选框但将“EMAIL TO”文本框留空会提交表单而不会给我一个错误！如果我更改HTML＆amp;的顺序在电子邮件输入之前放置两个传真输入，然后传真到（sendPOFaxTo）所需规则中断，并且EMAIL（sendPOEmailTo）所需规则有效。

有什么建议吗？

Answer 1

引用OP：

＆＃34;如果我改变HTML＆amp;的顺序在电子邮件输入之前放置两个传真输入，然后传真到（sendPOFaxTo）所需规则中断，并且EMAIL（sendPOEmailTo）所需规则有效。＆＃34;

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

修复方法是确保您使用最新版本的jQuery Validation插件及其additional-methods.js文件，即1.11.1。

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

ignore: []

需要jquery验证的jquery tokeninput

1 个答案: