ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery Validationプラグインのリモート検証method_jqueryのバグ解決方法

jQuery Validationプラグインのリモート検証method_jqueryのバグ解決方法

WBOY
WBOYオリジナル
2016-05-16 18:24:001012ブラウズ

ただ、不思議なことに、最近使ってみると、ちょっと堅苦しいし、既存機能の適応力が弱いし、変なバグもあるので、ちょっと違和感があります。どのようなプロジェクトにもバグがあるのは普通のことですが、このバグは実はドキュメントには記載されているものの実装されていない機能であり、少々無理があります。この問題はリモート検証方法にあります。幸いなことに、後で参照できるようにここに記録しておきます。
フォーム検証では、ユーザー登録時のユーザー名が存在するかどうかの確認など、判断のためにサーバーにAJAXリクエストを送信する必要がある場合があります。 jQuery Validation プラグインは、これを達成するためのリモート方法を提供します。たとえば、次のようにフォームを検証できます:

コードをコピー コードは次のとおりです:



スクリプト言語="javascript" >
$( '#regForm').validate({
'rules': {
'userName': {
'required': true,
'remote': '/ account/verify'
}});


このように、jQuery 検証は「/account/verify?userName=jeffz」のような URL をリクエストします。 true/falseを取得します。残念ながら、ASP.NET MVC を使用する場合、DefaultModelBinder の強力なバインド機能を利用するために、入力名を特定の形式で記述することがよくあります。例:


同時に、検証に使用するアクション メソッドのパラメーター名も異なる場合があります:


public ActionResult Verify(string name) { ... }


ドキュメントの説明
によると、この時点で次のように書く必要があります:
$( '#regForm').validate({
'rules': {
'user.Name': {
'remote': {
url: '/account/verify',
data: {
name: function( ) { return $("#userName").val(); }


ただし、実際のその結果、jQuery は依然として「/account /verify?user.Name=jeffz」を要求しており、困惑しています。 3 回確認した後、jquery.validation.js のソース コードに目を向けなければなりませんでした。読んで気を失いそうになりました。


コードをコピー コードは次のとおりです。 remote: function(value, element, param) {
if ( this.optional(element) )
return "dependency-mismatch";
...
param = typeof param == "string" && {url:param} || param;
if (previous.old !== value ) {
previous.old = value ;
var validator = this;
this.startRequest(element);
data[element.name] = value;名前?
$.ajax($.extend(true, {
url: param,
mode: "abort",
port: "validate" element.name,
dataType: "json" ,
data: data,
success: function(response) {
...


私は非常に奇妙です、なぜこれが行われるのかわかりません、これはそうです指定された効果がまったくありません。 次に、パラメータ名の役割を変更します。



コードをコピーします。
コードは次のとおりです。 remote: function(value, element, param) { if (this.optional(element))
return "dependency-mismatch";
param = typeof param == "string" && {url:param} || param;
if (previous.old !== value) {
previous.old = value; = this;
this.startRequest(element);
var data = {};
$.ajax($.extend(true, { // url: param,
url: param .url,
mode: "abort",
port: "validate" element.name,
dataType: "json",
/ / data: data,
data: param.data || data,
success: function(response) {
...


2 か所を変更するだけで問題は解決します残念ながら、jquery.validate.min.js も同様です。
このような問題が発生するのは非常に不可解です。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。