1

ダイアログの検証にjquery.validate.jsプラグインを使用しています。私の問題は、クラスを取得するために最初の問題のあるフィールドのみを送信し、フィールドの横にあるフェードアウトdivのヒントとしてフィールドエラーを表示したいということです。（今すぐプラグインを書くと、すべてのフィールドにラベルが追加されます）

ここに画像の説明を入力してください

私は十分に明確だったと思います！

前もって感謝します！！！

（さらに何かが必要な場合は、それを求めてください）

編集

そのためのコード

$("#wdw1003_useraddform").validate({
    rules : {
        wdw1003_username : {
            required : true
        },
        wdw1003_password : {
            required : true
        },
        wdw1003_fullname : {
            required : true
        },
        wdw1003_email : {
            required : true,
            email : true
        }
    },
    messages : {
        wdw1003_username : {
            required : "Field User Name is required"
        },
        wdw1003_password : {
            required : "Password is required"
        },
        wdw1003_fullname : {
            required : "Field Full Name is required"
        },
        wdw1003_email : {
            required : "Field E-mail is required",
            email : "Is not a valid e-mail"
        }
    }
});

ankur20usコメントの後に編集

フォームはこの行で生成されます

$form = new Form('useraddform', '#', $id."_");
$form -> setRequired('<img src="images/required.png" alt="Required" align="absmiddle" />', '<img src="images/required.png" alt="Required" align="absmiddle" />' . $trans -> translate('denotes required field'));
$form -> addElement('text', 'username', $trans -> translate('User Name'));
$form -> addElement('password', 'password', $trans -> translate('Password'));
$form -> addElement('text', 'fullname', $trans -> translate('Full Name'));
$form -> addElement('text', 'email', $trans -> translate('E-mail'));
$form -> addElement('select', 'perms', $trans -> translate('Permissions'), array('options' => $perms, 'value' => 'level1'));
$form -> addElement('select', 'status', $trans -> translate('Status'), array('options' => $status, 'size' => "1"));
$form -> addElement('textarea', 'comments', $trans -> translate('Comments'));
$form -> addElement('select', 'lang', $trans -> translate('Language'), array('options' => $langs, 'size' => "1"));
$form -> addElement('submit', 'submit', $trans -> translate('Create User'), array('style' => "clear:both; float:right; margin-right: 8%;"));

上記のJavaScriptはこれらの行から出てきます

     $form -> addRule('username', 'required', $trans -> translate('Field User Name is required'));
$form -> addRule('password', 'required', $trans -> translate('Password is required'));
$form -> addRule('fullname', 'required', $trans -> translate('Field Full Name is required'));
$form -> addRule('email', 'required', $trans -> translate('Field E-mail is required'));
$form -> addRule('email', 'email', $trans -> translate('Is not a valid e-mail'));

だからあまり変えられない!!!

4

2 に答える 2

2

デモ これは、このプラグインがそのヒントのようなものをサポートし、それが機能するために必要なものです

<form id='validateMe'>
<input value=""  class="validate[required] text-input" type="text" name="reqplaceholder" id="reqplaceholder" />
<input type='submit' value='Validate'/>
</form>

Jqueryコーディングの一部

jQuery("#validateMe").validationEngine();
于 2012-05-19T16:02:46.453 に答える
0

これが私が見つけた解決策です。私はこのように私のページに隠されたdivを作成しました

<div id="validationMessageBox" class="ui-corner-all" style="display: none;">
    <div id="validationMessageBoxSymbol" class="ui-icon ui-icon-alert"></div>
    <div id="validationMessageBoxMessage"></div>
</div>

次に、jquery.validate APIのshowErrors：function（errors）を使用して、メッセージを更新し、最初に欠落している要素の横に配置する非表示のdivを表示しました。そして最後にフェードアウト。

最終的なコードは以下のとおりです。

$("#wdw1003_useraddform").validate({
    rules : {
        wdw1003_username : {
            required : true
        },
        wdw1003_password : {
            required : true
        },
        wdw1003_fullname : {
            required : true
        },
        wdw1003_email : {
            required : true,
            email : true
        }
    },
    messages : {
        wdw1003_username : {
            required : "Field User Name is required"
        },
        wdw1003_password : {
            required : "Password is required"
        },
        wdw1003_fullname : {
            required : "Field Full Name is required"
        },
        wdw1003_email : {
            required : "Field E-mail is required",
            email : "Is not a valid e-mail"
        }
    },
    showErrors : function(errors) {
        var error = this.errorList[0];
        if(undefined != error) {
            var $element = $(error.element);
            var message = error.message;
            $element.addClass("ui-state-error");
            $("#validationMessageBox").addClass("ui-state-error").css({
                left : $element.offset().left + $element.width() + 15,
                top : ($element.offset().top)
            });
            $("#validationMessageBoxMessage").html(message);
            $("#validationMessageBox").show("fast");
            $element.removeClass("ui-state-error", 2000);
            $("#validationMessageBox").fadeOut(2000);
        }
    },
    onclick : false,
    onkeyup : false,
    onfocusout : false
});
于 2012-05-19T22:04:30.317 に答える