jquery ile form giriş değerlerini kontrol etme

Question

Giriş/select değerlerinin bir sınıfla (#customerForm formundadır) boş olup olmadığını kontrol etmek ve görmek için jQuery kullanmak istediğim bir formum var. Onlar formun gönderilmesini önlemek ve giriş/seçim kutusunun rengini kırmızıya çevirmek istiyorum. Eğer bir giriş/seçim değerlerinin tümü bir sınıfla birlikte değerlere sahipse, formu göndermek, form girişlerini soldurmak ve bir sonraki formda kaybolmak istiyorum. İşte benim kod:

$('#customerForm').submit(function (event) { 
    var value = $('.required').each(); 
    if (value === "") { 
     value.addClass("invalid"); 
     return false; 
    } else { 
     value.removeClass("invalid"); 
     $('#billForm, #shipForm').fadeOut(); 
     $('#payment-form').fadeIn(); 
    } 
}); 

sorun formu giriş değerleri kontrol etmez ve zaten formu gönderir. Herhangi bir yardım Muhteşem olacak.

Answer 1

$ gibi, her bir elemanın döngü. Her() girişlerin bir dizi döner.

Her girişin üzerinden geçmeli ve formun gönderilmesinden önce değeri kontrol etmelisiniz.

$(".required").each(function() { 
    //validation 
}); 

daha tam bir örnek:

$('#customerForm').submit(function (event) { 
    var error = false; 
    $(".required").each(function() { 
    if ($(this).val() === "") 
    { 
     $(this).addClass("invalid"); 
     error = true; 
    } 
    else 
    { 
     $(this).removeClass("invalid"); 
    } 
    }); 
    if(!error) 
    { 
    $('#billForm, #shipForm').fadeOut(); 
    $('#payment-form').fadeIn(); 
    } 
    else 
    { 
    return false; 
    } 
}); 

Answer 2

Her birini kullanarak bir alan yakalayamazsınız. Her biri onların üzerinden tekrarlamaktır.

Bunun için yapmanız gerekir.

$('#customerForm').submit(function (event) { 
    var value = $('.required'); // Get all the required fields 
    var cnt=0; // setup a counter 
    // Loop therough required fields and apply error class based on value 
    $.each(value, function(i,val){ 
      if (val.val() === "") { 
      cnt++;//add to the count of invalid fields 
      val.addClass("invalid");// apply error class 
      } else { 
      val.removeClass("invalid"); 
      } 
    }); 
    // Check the cnt variable is larger than 0, means we have errors 
    if(cnt!=0){ 
      return false; 
    // otherwise, continue 
    } else { 
     $('#billForm, #shipForm').fadeOut(); 
     $('#payment-form').fadeIn(); 
    } 
}); 

Answer 3

Bu durumda büyük ('zorunludur.'), Bu

$('.required').each((function(index) { 
var error = 0; 
value = $(this).html(); 
if (value === "") { 
    this.addClass("invalid"); 
    error = 1; 
} else { 
    this.removeClass("invalid"); 
    $('#billForm, #shipForm').fadeOut(); 
    $('#payment-form').fadeIn(); 
} 
if (error) 
    return false; 
});