2012-02-24 10 views
3

ユーザーエントリと提案がドロップダウンリストに表示されるajax関数があります。 私の問題は、jQueryの検証を使用していることです。ユーザーが提案をクリックすると、onlurなどのユーザーがクリックした値を取得できません。jQueryの検証で1つのフィールドでぼやけを取り除く

私が使用して一つのフィールド上のonblur機能を削除しようとしました:

$('#customerExist').bind('blur',function(){ 
      return true; 
    }); 

をしかし、これは動作しません。私はajax-suggestionの横のすべてのフィールドでonblurの検証を使いたいと思っています。

最高の解決策は、すべてのフィールドでonblurの検証を行うことですが、検証方法が1秒間曇る可能性があります。それは入力フィールドの値を取る前に。

私はonfocusout: false,を使用することができますが、私はそれを避けようとします。

jQuery.validator.addMethod("customerExist", function(value, element, param) { 
if (this.optional(element)) 
    return "dependency-mismatch"; 

var previous = this.previousValue(element); 
if (!this.settings.messages[element.name]) 
    this.settings.messages[element.name] = {}; 
previous.originalMessage = this.settings.messages[element.name].remote; 
this.settings.messages[element.name].remote = previous.message; 

param = typeof param == "string" && {url:param} || param; 

if (this.pending[element.name]) { 
    return "pending"; 
} 
if (previous.old === value) { 
    return previous.valid; 
} 

previous.old = value; 
var validator = this; 
this.startRequest(element); 
var data = {}; 
data["customer"] = encodeURIComponent(value); 
$.ajax($.extend(true, { 
    url: www+"validation.jsp", 
    dataType: "json", 
    data: data, 
    success: function(response) { 
     validator.settings.messages[element.name].remote = "This customer do not exist";//previous.originalMessage; 
     var valid = response === true; 
     if (valid) { 
      var submitted = validator.formSubmitted; 
      validator.prepareElement(element); 
      validator.formSubmitted = submitted; 
      validator.successList.push(element); 
      validator.showErrors(); 
     } else { 
      var errors = {}; 
      var message = response || validator.defaultMessage(element, "remote"); 
      errors[element.name] = previous.message = $.isFunction(message) ? message(value) : message; 
      validator.showErrors(errors); 
     } 
     previous.valid = valid; 
     validator.stopRequest(element, valid); 
    } 
}, param)); 
return "pending"; 
    }, ""); 

答えて

2

あなたは onfocusoutパラメータとしての機能を提供することができます。

これは、検証方法です。たとえば あなたが特定の要素の検証を中止する場合:あなたは遅れて検証を行いたい場合は

$('#filterForm').validate(
    {   
     onfocusout:function (element) { 
      if (!$(element).is('.customerExist')) { 
       if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) { 
        this.element(element); 
       } 
      } 
     } 
    }); 

、あなたは次のことを試すことができます。

$('#filterForm').validate(
    { 
     onfocusout:function (element) { 
      var me = this; 
      var delayedValidation = function() { 
       me.element(element); 
      }; 
      if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) { 
       if ($(element).is('.customerExist')) { 
        setTimeout(delayedValidation, 200); 
       } else { 
        this.element(element); 
       } 
      } 
     } 
    }); 
1

私はと同様のアプローチを示唆しています@Kipriz。ただし、要素を直接参照するのではなく、要素のクラスをチェックする必要があります。

// suppresses on-focusout validation of fields marked 'no-validate-on-focusout' 
// validation still occurs on attempting to submit the form 
(function() { 
    var oldonfocusout = $.validator.defaults.onfocusout; 
    $.validator.setDefaults({ 
     onfocusout: function (element) { 
      if ($(element).hasClass('no-validate-on-focusout')) { 
       return; 
      } 
      oldonfocusout.call(this, element); 
     } 
    }); 
}()) 

次に、クラスを追加するだけで、任意の要素をぼかしで同じように動作させることが簡単にできます。

<input class="no-validate-on-focusout" type="input" /> 
関連する問題