1

我正在使用 jQuery.Validate 来验证和提交我的表单。

在此特定页面上，用户可以选择输入信用卡信息（6 个字段）或输入采购订单编号（1 个字段）。

选择是通过单选按钮进行的​​。

<table cellpadding="0" cellspacing="0" align="center" bgcolor="#FFFFFF" width="100%">
  <tbody>
    <tr>
      <td rowspan="5" width="280" valign="top"><br /></td>
      <td width="440" colspan="2"><br />
        <strong>name</strong> (as it appears on card) *<br />
        <input type="text" name="cardName" maxlen="100" onchange="selectRadio(0)" value="" /></td>
    </tr>
    <tr>
      <td colspan="2" width="440"><strong>card type</strong> *<br />
        <select name="cardType" onchange="selectRadio(0)">
          <option value="MasterCard">MasterCard</option>
          <option value="VisaCard">Visa</option>
          <option value="AmExCard">American Express</option>
        </select></td>
    </tr>
    <tr>
      <td width="440" colspan="2"><strong>card number</strong> (no spaces) *<br />
        <input type="text" name="cardNumber" maxlen="25" onchange="selectRadio(0)" value="" /></td>
    </tr>
    <tr>
      <td width="440" colspan="2"><strong>card identification number</strong> (on back of credit card)<br />
        <input type="text" name="cardId" maxlen="6" onchange="selectRadio(0)" value="" /></td>
    </tr>
    <tr>
      <td colspan="2" width="440"><strong>expiration date</strong> *<br />
        <select name="ExpMon" onchange="selectRadio(0)">
          <option value="">&lt;month&gt;</option>
          <option value="1">01</option>
          <option value="2">02</option>
          <option value="3">03</option>
          <option value="4">04</option>
          <option value="5">05</option>
          <option value="6">06</option>
          <option value="7">07</option>
          <option value="8">08</option>
          <option value="9">09</option>
          <option value="10">10</option>
          <option value="11">11</option>
          <option value="12">12</option>
        </select>

        <select name="ExpYear">
          <option value="" onchange="selectRadio(0)">&lt;year&gt;</option>
          <option value="2012">2012</option>
          <option value="2013">2013</option>
          <option value="2014">2014</option>
          <option value="2015">2015</option>
          <option value="2016">2016</option>
        </select></td>
    </tr>
    <tr>
      <td width="280"> </td>
      <td colspan="2" width="440"><br /></td>
    </tr>
    <tr>
      <td><input type="radio" name="paymentMode" value="purchaseOrder" />
        pay using a purchase order number<br /></td>
      <td valign="top"><br />
        <br />
        <br />
        <strong>purchase order number</strong> *<br />
        <input type="text" name="PONumber" maxlen="40" onchange="selectRadio(1)" /></td>
    </tr>
  </tbody>
</table>

我的验证代码如下所示：

<script type="text/javascript">
    $(document).ready(function(){
        $("#frmRegistration2").validate({
            debug: false,
            rules: {


            },
            messages: {

            },
            submitHandler: function(form) {
                // do other stuff for a valid form
                $.post(\'/beta4/_action.php\', $("#frmRegistration2").serialize(), function(data) {
                        $(\'.pane2\').slideUp(\'slow\');
                        $(\'#result2\').html(data);
                        $(\'.pane3\').slideDown(\'slow\');

                });
            }
        });
    });
    </script>';

有人建议使用依赖规则，但是我不知道如何使用它.. 给出的示例只是检查我是否选中了单选按钮。问题是我有 2 个单选按钮，而不仅仅是一个。所以它必须取决于单选按钮的价值。有人可以告诉我如何做到这一点吗？

这是示例代码：

$("#myForm").validate({
   rules: {
      contact: {
         required: {
            depends: function(element) {
               return $("#myCheckbox:checked");
            }
         }
      }
   }
})
4

1 回答 1

0

经过进一步研究，这似乎在规则中起作用：

rules: {
PONumber: {
    required: {
        depends: function(element) 
                  {
                  return $("[name=paymentMode]:checked").val() == "purchaseOrder";
                  }             
               }
           }            
       }

对我来说困难的部分是所有其他示例都忽略了单选按钮应该用作选择器的事实。即，有多个单选按钮具有相同的名称，但具有不同的值。使用此方法，您可以根据选中的单选按钮的值设置您的依赖。对我有用，它应该对你有用。

于 2012-09-17T12:18:55.060 回答