जांच करें कि इनपुट क्षेत्र jQuery

Question

साथ खेतों पर रिक्त है मैं सभी वर्ग 'आवश्यक' के साथ 5 क्षेत्रों के साथ एक फार्म है

इम उस पर सुनिश्चित करने के लिए प्रस्तुत इन क्षेत्रों खाली नहीं हैं, अगर वे कर रहे हैं, एक वर्ग को जोड़ने की कोशिश कर रहा , यदि नहीं, तो सत्य वापस आइए - ive ने केवल कुछ भाग्य के साथ निम्नलिखित की कोशिश की, भले ही फ़ील्ड खाली हों, फॉर्म अभी भी सबमिट हो गया है।

$('.submit').click(function(){ 

if($('.required').val() == "") { 
     $('.required').addClass('error'); 
     return false; 
    } else { 
     return true; 
    }; 
}); 

Answer 1

प्रयास करें:

$('.submit').click(function(e){ 
if(!$('.required').val()) { 
    $('.required').addClass('error'); 
    e.preventDefault(); 
    } else { 
    return true; 
    }; 
}); 

Answer 2

if($('.required') jQuery वस्तुओं का संग्रह वापस आ जाएगी, जबकि .val() करने के लिए कॉल ही नहीं संग्रह के पहले तत्व का उपयोग करेगा अपने परीक्षण करने के लिए।

कुछ इस तरह की कोशिश (संपादित करें: के बाद से फिल्टर expr आप के लिए इस बात का ध्यान रखना होगा, एक पाश या परीक्षण करने की ज़रूरत नहीं है):

$('.submit').click(function(e) { 
    var ins = $('input.required[value=""]');   
     ins.addClass('error'); 
     return false; 
    } 
    return true; 
} 

Answer 3

आप रिक्त फ़ील्ड प्राप्त करने के लिए फिल्टर का उपयोग करना चाहिए । फ़ॉर्म सबमिट करने के लिए भी बेहतर है ताकि यह एंटर कुंजी प्रेस भी संभाल सके। आप को संभाल करना होगा यदि नहीं तो प्रपत्र के अंदर कुंजी दबाव है कि फार्म की घटना प्रस्तुत ट्रिगर किया जाएगा दर्ज

$('yourform').submit(function(){ 
    // empty will contain all elements that have empty value 
    var empty = $('.required').filter(function(){ 
     return $.trim(this.value).length === 0; 
    }); 
    if(empty.length){ 
     empty.addClass('error'); 
     return false; 
    } 
}); 

Answer 4

इस प्रयास करें:

$('.submit').click(function() { 
    $('.required').removeClass('error').filter(function() { 
     return !$.trim(this.value).length; 
    }).addClass('error'); 
}); 

कक्षा error रिक्त फ़ील्ड केवल और में जोड़ा जाता है अन्यथा हटा दिया गया है।

http://jsfiddle.net/dfsq/2HxaF/

एक और भिन्नता जो अपने कार्य के लिए उपयोगी हो सकता है: खेतों पर अतिरिक्त सत्यापन धुंधला:

$('.submit').click(validate); 
$(document).on('blur', '.required', function() { 
    validate($(this)); 
}); 

function validate($field) { 
    ($field instanceof jQuery && $field || $('.required')).removeClass('error').filter(function() { 
     return !$.trim(this.value).length; 
    }).addClass('error'); 
} 

http://jsfiddle.net/dfsq/2HxaF/1/

Answer 5

एक छोटी सी पार्टी के लिए देर हो चुकी है, लेकिन मुझे लगता है कि यह सबसे अच्छा है समाधान:

भरने वाले सभी आवश्यक फ़ील्ड को बदलें: http://jsfiddle.net/LREAh/

$('form').submit(function(){ 
if(!$('.required').val()) { 
    $('.required').attr('placeholder', 'You forgot this one'); 
    return false; 
    } else { 
     return true; 
}; 
}); 

सबमिट किए गए फ़ॉर्म का केवल आवश्यक फ़ील्ड बदलें: http://jsfiddle.net/MGf9g/

$('form').submit(function(){ 
if(!$(this).find('.required').val()) { 
    $(this).find('.required').attr('placeholder', 'You forgot this one'); 
    return false; 
} else { 
    return true; 
} 
}); 

बेशक आप attr('placeholder', 'You forgot this one');addClass('error'); के लिए बदल सकते हैं - यह केवल प्रदर्शन के लिए किया गया था। आपको HTML btw पर id="formX" की आवश्यकता नहीं है, मैं बस कुछ और करने की कोशिश कर रहा था और निकालना भूल गया था।