0

私はjqueryを初めて使用します。私は調査を続けており、query.validate.min.jsを使用してajaxをロードする前にメールアドレスを検証しようとして問題が発生しています。

フォームを検証し、入力が有効な場合にのみapp.ajax.loadを呼び出します。ajaxが読み込まれる前に設定した条件が何であれ、フォームは検証なしで投稿され、コールバックも無視されます。（これは「ありがとう」のメッセージです）

誰かが条件を手伝ってくれますか、それとも検証するために別の関数を書く必要がありますか？

$('#emailsignup_form').validate({
rules: {
email: {
required: true;
email:true
}
},
messages: {
email: "Invalid Email",
},

submitHandler: function(form){
    app.ajax.load({
         reqName : 'emailSubmit',
         url: '$httpUrl('Bronto-OptIn')$?email=' + $('#email').val(), 
         selector : '#emailbox',
         callback: function(responseText, textStatus) { }
    });
            return false;
});

});


<form id="emailsignup_form" name="emailsignup_form" method="post" action="$httpUrl('Bronto-OptIn', 'fid', 'information')$">
<div class="fl"><input class="email-signup-input" type="text" title="Enter Your Email Address" value="Enter Your Email Address" name="email" id="email" /></div>
<div class="fl"><button class="email-signup-btn" value="Submit" name="submitemail" id="submitemail">Submit</button></div>
</form>
4

1 に答える 1

2

と呼ばれるものもある場合、input nameのを割り当てるのは危険です。技術的には機能しますが、以下に示すように、大きな混乱を招く可能性があります。例：あなたの内部は、名前付き、または呼び出された？に割り当てられることを意図していました"email"rule"email"emailmessages:inputemailruleemail

rulesおよびに構文エラーがありますmessages...

rules: {
email: { 
required: true; // <-- semicolon incorrect, must be a comma
email:true
}
},
messages: {
email: "Invalid Email", // <-- should define a message for each corresponding rule
},

次のようなものにする必要があります...

    rules: {
        email: { // the field name
            required: true,
            email: true // the rule
        }
    },
    messages: {
        email: { // the field name
            required: "this is required",
            email: "Invalid email" // the rule's message
        }
    },

そして、あなたsubmitHandler:は奇形です...

submitHandler: function (form) {
    app.ajax.load({
        reqName: 'emailSubmit',
        url: '$httpUrl('Bronto - OptIn')$?email=' + $('#email').val(),
        selector: '#emailbox',
        callback: function (responseText, textStatus) {}
    });
    return false; 
}); // <-- this is not correct

このようなものにする必要があります（ajax関数が正しいと仮定します）...

submitHandler: function (form) {
    app.ajax.load({
        reqName: 'emailSubmit',
        url: '$httpUrl('Bronto - OptIn')$?email=' + $('#email').val(),
        selector: '#emailbox',
        callback: function (responseText, textStatus) {}
    });
    return false; 
}

デモ：

http://jsfiddle.net/CagLw/

于 2013-01-21T01:49:06.037 に答える