1

我们有一个使用JQuery Validation Plugin的表单，并希望忽略任何未更改其默认值的表单字段值。

例如，我们有一个信用卡更新表格，为了安全起见，只显示信用卡号的最后四个。它看起来像这样：

** ** 5629 _

每个用户的此默认值将不同，因为他们的最后四张信用卡将不同。

如果用户在他们的个人资料更新期间没有更改他们的默认信用卡值，我们希望绕过此表单字段上的验证路由，因为显然它不会验证为有效的信用卡号。

这是我们当前的验证片段：

card_number: {
  required: true,
  creditcard: true
}

messages: {
  card_number: {
    required: "Please enter a <strong>valid credit card number</strong>.",       
  }

这是表单域：

<input type="text" name="card_number" id="card_number" title="Your credit card number." value="************ 5629" />

我们如何忽略验证任何未更改默认值的表单字段值？

谢谢。

================================================

给安德鲁的新说明：

我认为由于我们验证信用卡类型的方式，我们遇到了一些小故障。

这是完整的代码段以及您的初始修复：

card_number: {
  creditcardtypes: function() {
    // return an object with a property named the same as the pay method
    var result = new Object();
    var propertyName = $('select[name="pay_method"]').val().toLowerCase();
    var propertyValue = 1;
    eval("result."+propertyName+"='"+propertyValue+"'");
    return result;
  },
  ccnotdefault: true,
  required: true
},

我们如何才能适应信用卡类型规则？目前，验证失败，因为默认信用卡值不是有效的信用卡类型。

再次感谢安德鲁。

=================================================

表格字段：

          <!--- PAYMENT METHOD FIELD --->
      <tr>
        <td style="padding-top:15px; text-align:right; width:45%;"><label for="pay_method">&nbsp;Payment Method:
          <span class="orderlineredsm"><strong> * </strong></span></label></td>
        <td style="padding-top:15px; text-align:left; width:55%;" colspan="2" align="left" id="pmethod">
          <select name="pay_method" id="pay_method" class="highlightme required" style="width: 115px;" onchange="jQuery('#card_number').valid()" title="Your Payment Method.">
              <option value="Visa" <cfif form.pay_method EQ "Visa">selected="selected"</cfif>>Visa</option>
              <option value="Mastercard" <cfif form.pay_method EQ "Mastercard">selected="selected"</cfif>>Mastercard</option>
              <option value="Amex" <cfif form.pay_method EQ "Amex">selected="selected"</cfif>>Amex</option>
              <option value="Discover" <cfif form.pay_method EQ "Discover">selected="selected"</cfif>>Discover</option>
              <option value="Diners" <cfif form.pay_method EQ "Diners">selected="selected"</cfif>>Diners</option>
          </select>
        </td>
      </tr>
      <!--- END PAYMENT METHOD FIELD --->

      <!--- CARD NUMBER FIELD --->
      <tr>
        <td style="text-align:right; width:45%;"><label for="card_number">&nbsp;Credit Card Number:
          <span class="orderlineredsm"><strong> * </strong></span></label></td>
        <td style="text-align:left; width:55%;" colspan="2" align="left" id="cnumber">
          <input type="text" name="card_number" id="card_number" class="highlightme" style="width: 130px;" maxlength="19" title="Your credit card number." value="************<cfoutput>#form.card_number#</cfoutput>" onfocus="clearText(this)" onblur="clearText(this)" />
          &nbsp;<span class="create-tooltip" title="For your protection and security, only the <strong>last four digits of your credit card number</strong> are shown.<br /><br /><strong>NOTE:</strong> Only change if you are updating your credit card number."><img src="/public/images/help_25.png" style="margin-bottom:1px;" alt="help" width="25" height="25" /></span>
        </td>
      </tr>
      <!--- CARD NUMBER FIELD --->

==================================================== ========

可能的修复

card_number: {
  ccnotdefault: function(){ return $('#pay_method').val(); },
  required: true
},

jQuery.validator.addMethod("ccnotdefault", function(value, element, param) {
  // if the element is optional, don't validate 
  return this.optional(element) ||
  // or if the value is equal to the default value
  (value === element.defaultValue || 
  // or, finally, if the cc number is valid
  jQuery.validator.methods.creditcard2.call(this, value, element, param));
}, jQuery.validator.messages.creditcard);

http://www.ihwy.com/labs/downloads/jquery-validate-creditcard-2/jquery.validate.creditcard2-1.0.1.js
4

1 回答 1

2

我会为此编写一个自定义规则，该规则调用默认信用卡规则，但也会考虑该字段的默认值：

$.validator.addMethod("ccnotdefault", function(value, element) {
    // if the element is optional, don't validate 
    return this.optional(element) ||
       // or if the value is equal to the default value
       (value === element.defaultValue || 
       // or, finally, if the cc number is valid
       $.validator.methods.creditcard.call(this, value, element));
}, $.validator.messages.creditcard);

$(document).ready(function() {
    $("#myform").validate({
        rules: {
            card_number: {
                ccnotdefault: true,
                required: true
            }
        }
    });
});

示例：http: //jsbin.com/ejonid/2/

于 2012-06-12T15:20:06.150 回答