0

我有一个名为的自定义 jQuery 验证规则fiftyCents(),其中有两个规则:

  1. 如果该项目是免费的,人们可以以 0.00 美元的价格“购买”它,或者他们可以支付超过 0.50 美元。
  2. 如果该项目不是免费的,那么他们必须至少支付指定的费用(存储在隐藏的cachedValue输入字段中)。

所以这是我的两个验证错误消息。我在添加这些时遇到的问题fiftyCents()是,我只能弄清楚如何将其评估为真/假,如果为假,则显示一条消息,例如"Amount must be $0.00 OR greater than $0.50.".

JSfiddle (下面的代码)的解决方案似乎是制作一个message可以成为fiftyCents()函数一部分的对象。但是,我不知道如何return评估true/false. 想法?

JS:

$('button').click(function(){
  $('form').validate().form();
});
$.validator.addMethod("fiftyCents", function(value) {

  var cachedValue=$('.purchaseModalAmtPaidCached').val();
  var value = $('.purchaseModalAmtPaid').val();
  var message="Amount must be $0.00 OR greater than $0.50.";
  if(cachedValue>0) message='Amount must be at least'+cachedValue+'.';
  return cachedValue<=value && (value==0 || (0.51<=value && value<=10000));
}, message);   

$.validator.classRuleSettings.purchaseModalAmtPaid = { fiftyCents: true };

HTML:

 <form>
  <input  class="purchaseModalPassword required" minlength="8" type="password"name="password" value="dddddddv" title="Please enter a valid password"  />
  <input type="text"  title="Amount must be $0.00 OR greater than $0.50" 
  class="required purchaseModalAmtPaid" name="amt_paid" value="" />
  <input type="hidden" class='purchaseModalAmtPaidCached required' name="AmtPaidCached" value="0.00" /> 
  <button type='button'>Buy</button>
 </form>​
4

1 回答 1

0

好的,我回答了我自己的问题。我最终做的是将这两个规则拆分为它们自己的自定义方法。在调用任一自定义方法之前,我使用了一个if/else来确定应该遵循两者中的哪一个。

这是JSFiddle和下面的代码:

JS:

$('button').click(function(){
$('form').validate().form();

});

var params=$('.purchaseModalAmtPaidCached').val();                   
if(params>0){      
  $.validator.addMethod("AmountOrGreater", function(value, element, params) {
  console.log('amountOrGreater'+params[0]); 
  return params[0]<=value && (value==0 || (0.51<=value && value<=10000));
  }, $.validator.format("Amount must be at least {0}."));
  $.validator.classRuleSettings.purchaseModalAmtPaid = { AmountOrGreater: params };                       
} 
else{ 
  $.validator.addMethod("fiftyCents", function(value, element, params) {
  console.log('fiftyCents'+params[0]);
  return params[0]<=value && (value==0 || (0.51<=value && value<=10000));
  }, "Amount must be $0.00 OR greater than $0.50.");  
  $.validator.classRuleSettings.purchaseModalAmtPaid = { fiftyCents: params };  
} //else

HTML:

 <form>
  <input  class="purchaseModalPassword required" minlength="8" type="password" name="password" value="dddddddv" title="Please enter a valid password"  />
  <input type="text"   
class="required purchaseModalAmtPaid" name="amt_paid" value=""  /> 
  <input type="hidden" class='purchaseModalAmtPaidCached required' name="AmtPaidCached" value="0.00" /> 
  <button type='button'>Buy</button>
</form>​

注意: HTML 与 jQuery validate 合作的一个关键是,如果您为输入提供一个title=''属性,那么将始终使用该标题,从而覆盖您自定义规则中的消息。这在我的情况下是相关的 b/c 有两个自定义规则/消息,我无法在呈现 HTML 之前确定用户会看到哪一个。

于 2012-12-06T20:08:04.510 回答