आप इसे असीमित रूप से कर सकते हैं।
एक वैश्विक चर बनाएँ, मैं इसे ajax_done_and_successful_flag, कहता हूं कि आप प्रोग्राम की शुरुआत में झूठी शुरुआत करते हैं। आप अपने अजाक्स फ़ंक्शन जैसेफ़ंक्शन या आपके अजाक्स त्रुटि फ़ंक्शन जैसे विभिन्न स्थानों पर इसे सत्य या गलत पर सेट करेंगे।
फिर आपको अपने फ़ंक्शन मान्य करने के नीचे सबमिट हैंडलर जोड़ने की आवश्यकता है।
submitHandler: function(form) {
if (ajax_done_and_successful_flag === true) {
form.submit()
}
}
समस्या यह है कि कोड एक रैखिक तरीके से निष्पादित नहीं हो रहा है।
अपने कोड में फायरबग के console.log स्टेटमेंट का एक गुच्छा रखो।
निष्पादन के अनुक्रम का निरीक्षण करें। आप देखेंगे कि आपका
अजाक्स प्रतिक्रिया पिछली बार वापस आ जाएगी, या जब भी ऐसा लगता है।
यही कारण है कि सबमिट सबमिट करने से पहले सही अजाक्स
परिणाम के लिए मान्य फ़ंक्शन को मजबूर करने के लिए आपको सबमिट हैंडलर और वैश्विक ध्वज
की आवश्यकता है।
अजाक्स प्रतिक्रिया से स्क्रीन करने के लिए किसी भी उत्पादन, ऐसी सफलता समारोह और त्रुटि समारोह के रूप में अजाक्स कार्यों में किया जाना है, जरूरत है।
आपको वैध स्थान की सफलता/त्रुटि फ़ंक्शंस के रूप में उसी स्थान पर लिखना होगा।
इस तरह अजाक्स त्रुटि संदेश वैध फ़ंक्शन के त्रुटि फ़ंक्शन के साथ मिश्रित होते हैं।
यह अवधारणा थोड़ा मुश्किल लग सकती है।
विचार को ध्यान में रखना है कि सत्यापित करें समारोह में सफलता और त्रुटि कार्यों सफलता और अजाक्स कॉल में त्रुटि कार्यों के रूप में एक ही स्थान पर लिख रहे हैं, और कहा कि ठीक है, वह यह है कि कैसे यह होना चाहिए हो।
मेरे त्रुटि संदेशों का स्थान उपयोगकर्ता इनपुट प्रकार के बगल में है। यह एक अच्छा उपयोगकर्ता अनुभव बनाता है जो मुझे लगता है कि आप पूछ रहे हैं।
यहां मेरा कोड नमूना है। मैंने इसे सरल बना दिया।
मैं jQuery-1.7.1
और jQuery सत्यापन प्लग में चला रहा हूँ 1.6
मैं फ़ायरफ़ॉक्स 14.0.1 का उपयोग कर रहा हूँ और मैं भी सफलतापूर्वक क्रोम 21.0 पर यह की कोशिश की।
var ajax_done_and_successful_flag = false;
// Add methods
...
$.validator.addMethod("USERNAME_NOT_DUPLICATE", function (value, element) {
return this.optional(element) || validate_username_not_duplicate();
},
"Duplicate user name.");
// validate
$(document).ready(function () {
$('#register_entry_form form').validate({
rules: {
username: {
required: true,
minlength: 2,
maxlength: 20,
USERNAME_PATTERN: true,
USERNAME_NOT_DUPLICATE: true
},
...
errorPlacement: function (error, element) {
element.closest("div").find(".reg_entry_error").html(error);
},
success: function(label) {
label.text('Success!');
} ,
submitHandler: function(form) {
if (ajax_done_and_successful_flag === true) {
form.submit();
}
}
});
});
/* validation functions*/
function validate_username_not_duplicate() {
var username_value = $('#username').val(); // whatever is typed in
$.ajax({
url: "check_duplicate_username.php",
type: "POST",
data: { username: username_value },
dataType: "text",
cache: false,
//async: false,
timeout: 5000,
error: function (jqXHR, errorType, errorMessage) {
ajax_done_and_successful_flag = false;
if (errorType === "timeout") {
$('#username').closest("div").find(".reg_entry_error").html("Server timeout, try again later");
} else if ...
},
success: function (retString, textStatus,jqXRH) {
if (retString === "yes") { // duplicate name
// output message next to input field
$('#username').closest("div").find(".reg_entry_error").html("Name already taken.");
ajax_done_and_successful_flag = false;
} else if (retString === "no") { // name is okay
// output message next to input field
$('#username').closest("div").find(".reg_entry_error").html("success!");
ajax_done_and_successful_flag = true;
} else {
console.log("in validate_username_duplicate func, success function, string returned was not yes or no.");
$('#username').closest("div").find(".reg_entry_error").html("There are server problems. Try again later.");
ajax_done_and_successful_flag = false;
}
} // end success function
}); // end ajax call
return true; // automatically return true, the true/false is handled in
// the server side program and then the submit handler
}
reg_entry_error पाठ इनपुट के बगल में जगह है। यहां फॉर्म का सरलीकृत कोड नमूना है।
<label class="reg_entry_label" for="username">Username</label>
<input class="reg_entry_input" type="text" name="username" id="username" value="" />
<span class="reg_entry_error" id="usernameError" ></span>
मुझे आशा है कि यह आपके प्रश्न का उत्तर देगा।
आप किस समाधान का उपयोग कर समाप्त कर चुके हैं? मुझे एक ही समस्या का सामना करना पड़ रहा है। –