アップデート
charlietfl のコメントと提案のおかげで (そして、ある時点で怒り、笑 - 私の失敗をお詫びします)、最終的に Validate 内からシステム チェックを取得し、電子メールが送信されるとフォームの送信が停止しました。これで私の質問には答えられたと思いますが、もう少しお待ちいただければ、あなたの助けを借りて最後の仕上げを行うことができます...
私の最初のビジョンでは、適切な「電子メールは既に存在します」というエラーをトリガーすることに加えて、ユーザーに状況をより完全に説明し、ログイン フォームへのリンクを提供する HTML を含む 2 番目の要素も設定しました。この 2 番目の要素は、フィールドの状態に応じて現れたり消えたりしました。
メッセージ/リモートセクションを使用してこれを行う方法はありますか?
ここに私が持っているもの:
$(document).ready(function(){
$("#signup").validate({
errorElement: "span",
errorPlacement: function(error, element) {
error.appendTo(element.prev());
//element.prev().replaceWith(error);
},
rules: {
"email": {
required: true,
email:true,
remote: {
url: "/ajax/emailcheck.php",
type: "post",
},
},
"password": {
required: true,
minlength: 8,
},
"password-check": {
required: true,
minlength: 8,
passmatch: true,
},
"tos": {
required: true,
minlength: 6,
}
},
messages: {
email: {
required: " is Required",
email: " is Improperly Formatted",
remote: " already exists",
},
},
password: {
required: " is Required",
minlength: " requires at least 8 characters",
},
"password-check": {
required: " is Required",
minlength: " requires at least 8 characters",
passmatch: " must match the Passphrase",
},
tos: {
required: " is Required",
minlength: " requires at least 6 characters",
},
},
onkeyup: true,
onblur: true
});
そして、理想的には、次のようなものが大好きです。
messages: {
email: {
required: " is Required",
email: " is Improperly Formatted",
remote: " already exists",
remote: {
username: function() {
var emailcheck = $('#email').val();
return $('#username_availability_result').html(emailcheck + ' is already in our system. Please <a href="/login.php">log in here</a>.');
},
},
},
},
重ねて、そして事前に、あなたの継続的な注意とアドバイスに感謝します.
Z
元の質問
jQuery Validate を使用して、登録フォームで定期的な検証を実行しています。しかし、フォームの機能に追加したかった機能の 1 つは、電子メール アドレスが既にシステムに存在するかどうかを判断するための AJAX チェックでした。問題は、電子メール チェック機能が検証機能の外に存在するため、必要なときにフォームの送信を実際に停止しないことです。
これが私のコードです。(上位 50 行は、検証とパスワードの照合で構成されます。残りは、[メール フィールドのキーアップ イベントによってトリガーされる] AJAX チェックを構成します)。
// Method adds password matching abilities to the validator
jQuery.validator.addMethod("passmatch", function(value, element) {
return $('#password').val() == $('#password-check').val()
}, "* Passwords should match");
$(document).ready(function(){
$("#signup").validate({
errorElement: "span",
errorPlacement: function(error, element) {
error.appendTo(element.prev());
//element.prev().replaceWith(error);
},
rules: {
"email": {
required: true,
email:true,
},
"password": {
required: true,
minlength: 8,
},
"password-check": {
required: true,
minlength: 8,
passmatch: true,
},
"tos": {
required: true,
minlength: 6,
}
},
messages: {
email: {
required: " is Required",
email: " is Improperly Formatted",
},
password: {
required: " is Required",
minlength: " requires at least 8 characters",
},
"password-check": {
required: " is Required",
minlength: " requires at least 8 characters",
passmatch: " must match the Password"
},
tos: {
required: " is Required",
minlength: " requires at least 6 characters",
},
}
});
//check email availability
$('#email').keyup(function(){
check_availability();
});
});
//function to check username availability
function check_availability(){
//get the username
var username = $('#email').val();
//use ajax to run the check
$.post("/ajax/emailcheck.php", { username: username },
function(result){
//if the result greater than none
if(result > 0 ){
//show that the username is not available
$('#username_availability_result').html(username + ' is already in our system. Please <a href="/login.php">log in here</a>.');
}else{
//username available.
//clear any messages
$('#username_availability_result').html('');
}
});
}
エラーの状態でフォームを送信できないように、check_availability() 関数が停止 (およびクリアされたら開始) をトリガーする方法はありますか? または、キット全体と caboodle を addMethod を使用してどうにかして Validate に統合できますか (その場合、他の Validate エラーが表示される同じ要素ではなく、特定の ID 要素で可用性のフィードバックを提供していることに注意してください)。
皆様のご協力とアドバイスに感謝いたします。
Z