pengesahan ajax jquery gagal dan borang diserahkan untuk menyelesaikan masalah_jquery

validationEngine mengurangkan banyak kerja untuk kami dalam pengesahan borang bahagian hadapan Dalam kebanyakan kes, kami menggunakan validationEngine untuk mengesahkan borang dalam beberapa cara:

1 Gunakan penyerahan borang biasa Dalam kes ini, borang tidak akan diserahkan sekiranya Enjin pengesahan gagal dalam pengesahan.

2 Gunakan ajax untuk menyerahkan borang, tetapi jangan gunakan pengesahan ajax.

Kaedah ini juga agak mudah, cuma semak sama ada pengesahan diluluskan sebelum kami menggunakan permintaan ajax, contohnya:

Salin kod Kod adalah seperti berikut:

//kembali apabila pengesahan gagal
If(!$("form#ajaxForm").validationEngine("validate")) return ; $.ajax({
Taip: "POST",
URL: $("#ajaxForm").attr("action"),
Data: $("#ajaxForm").serialize(),
Jenis Data: "html",
Kejayaan: fungsi(data){
                                                    });

3 Gunakan borang biasa untuk menghantar, tetapi menggunakan pengesahan ajax ini agak mengelirukan Internet perlu menukar kod sumber , berikut ialah tangkapan skrin:

. Kaedah ini sesuai untuk keadaan semasa Kaedah pengubahsuaian ini sendiri tidak disyorkan dan mungkin memberi kesan kepada tempat lain Salah satu perkara yang saya dapati adalah apabila situasi berikut berlaku

Salin kod Kod adalah seperti berikut: fungsi beforeCall(borang, pilihan){

If(window.console){

console.log("Selepas pengesahan penyerahan borang diluluskan, panggilan balik sebelum penyerahan Ajax"); };
Kembalikan benar; };
//
fungsi ajaxValidationCallback(status,borang,json,options){
If(window.console){
console.log(status);
};
Jika(status === benar){
alert("borang itu sah!"); }  
};
jQuery(dokumen).sedia(fungsi(){
jQuery("#formID").Enjin pengesahan({
ajaxFormValidation: true, //Sama ada hendak menggunakan Ajax untuk menyerahkan borang
ajaxFormValidationMethod: 'post', // Tetapkan cara untuk menghantar data apabila Ajax menyerahkan
onAjaxFormComplete: ajaxValidationCallback, //Penyerahan borang, selepas pengesahan Ajax selesai
onBeforeAjaxFormValidation: beforeCall //Selepas pengesahan penyerahan borang diluluskan, panggilan balik sebelum penyerahan Ajax
});
});



beforeCall Kaedah ini tidak akan dipanggil, jadi masih tidak boleh digunakan

4 Gunakan ajax untuk mengesahkan dan menyerahkan borang menggunakan ajax Kaedah ini mengelirukan, dan kaedah di atas untuk mengubah suai kod sumber tidak mudah digunakan.

Untuk kaedah ketiga dan keempat, penyelesaiannya adalah seperti berikut:

Tambahkan kawalan atribut tersuai="Nama pengguna,e-mel" pada teg borang yang menggunakan pengesahan ajax Nilai atribut ialah ID kawalan yang akan disahkan menggunakan ajax (berbilang kawalan dipisahkan dengan koma).

Salin kod

Kod adalah seperti berikut:

Tambahkan dua url atribut (alamat permintaan ajax) dan ralat (mesej gesaan apabila gagal) pada setiap kawalan yang perlu disahkan

Salin kod

Kod adalah seperti berikut:

Isytiharkan dua tatasusunan global dalam javascript

Salin kod Kod adalah seperti berikut:

var controlId = new Array(); //Simpan ID kawalan yang gagal pengesahan
var errors = new Array(); //Simpan mesej gesaan untuk pengesahan yang gagal

Ideanya ialah untuk mendapatkan nilai atribut kawalan pada teg borang (gunakan koma untuk memisahkan setiap ID kawalan), gunakan ajax untuk melintasi permintaan dan apabila pengesahan gagal, tambahkan ID kawalan dan maklumat segera kepada controlId dan ralat , dan maklumat segera Apabila menyerahkan borang, tentukan sama ada controlId itu kosong, maklumat segera akan dipaparkan dalam satu gelung

Salin kod Kod adalah seperti berikut:

$(function() {
var ajaxForm2Controls = $("form#ajaxForm2Controls") ; //Apabila borang diserahkan
$(ajaxForm2Controls).submit(function() {
ajaxForm2Control(ajaxForm2Controls) ;           kembali palsu ;                                     });
//Sahkan kawalan apabila hilang fokus
valControls(ajaxForm2Controls); });



Kaedah penghantaran borang:

Salin kod

Kod adalah seperti berikut: fungsi ajaxForm2Control(obj) { //Kembali apabila terdapat mesej ralat dan paparkan mesej ralat If(controlId.length > 0) {

alertinfo() ;

          pulangan palsu ;                                        }  
If(!$(obj).validationEngine("validate")) return false; //Sahkan kawalan yang tidak menggunakan pengesahan ajax (medan yang tidak disahkan ajax boleh disahkan seperti biasa, dan akan dikembalikan jika gagal)
$.ajax({
Taip: "POST",
URL: $(obj).attr("tindakan"),
Data: $(obj).serialize(),
Jenis Data: "html",
Kejayaan: fungsi(data){
                                                                                                                                                                                                              
});
}



Tambahkan acara fokus pada bentuk

Salin kod

Kod adalah seperti berikut:

//Kawalan yang perlu disahkan dalam borang
fungsi valControls(ajaxForm2Controls) {
//Dapatkan kawalan yang memerlukan pengesahan ajax
var controlsStr = ajaxForm2Controls.attr("control"); //Kembali apabila atribut tidak ditentukan
If(typeof(controlsStr) === "undefined" || controlsStr.length <= 0) return ; //Dapatkan ID kawalan
secara berasingan var controls = controlsStr.split(/,/g)
for(var i dalam kawalan) {
//Tambah fokus meninggalkan acara
           $("#" kawalan[i]).kabur(fungsi() { 
If($(this).val().length <= 0) return false; //Tetapkan semula tatasusunan
                  controlId.length = 0;                          errors.length = 0 ; //Mesej ralat
            var error = $(this).attr("error") ;  
$.ajax({
Taip: "DAPAT",
​​​​ url: $(this).attr("url"),
Data: $(this).serialize(),
Jenis Data: "teks",
Kejayaan: fungsi(data){
Jika(data==="benar") {
//Letakkan mesej ralat ke dalam tatasusunan jika pengesahan gagal
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                controlId.push(controls[i]);                                                         ralat. push(error);                                                                                                                                                                                                                                                                                                                                                                             alertinfo() ;
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         });                                      }) ;                           }  
}



Mesej ralat:





Salin kod


Kod adalah seperti berikut:

//Mesej pop timbul
function alertinfo() {
If(controlId.length > 0) {
for(var i dalam controlId) {
//validationEngine kaedah, muncul gesaan untuk ID yang ditentukan                                                             // Penggunaan:$("#id").validationEnine("prompt.",">load // & lt; span style = "" & gt; buat prompt pada elemen ini, 3 menyatakan: "lulus", "ralat", "beban" & lt;/span & gt; & lt;/span & gt;                  $("#" controlId[i]).validationEngine("showPrompt", errors[i], "error");                                                                                                                    }  
}



Dengan cara ini, apabila kami menyerahkan borang dalam cara ketiga atau keempat, kami hanya boleh memanggil controlId untuk melihat sama ada terdapat nilai sebelum menyerahkan.