एक साधारण jQuery फॉर्म सत्यापन स्क्रिप्ट

Question

मैंने jQuery का उपयोग करके एक सरल सत्यापन फ़ॉर्म बनाया है। यह ठीक काम कर रहा है। बात यह है कि मैं अपने कोड से संतुष्ट नहीं हूं। क्या एक ही आउटपुट परिणाम के साथ अपना कोड लिखने के लिए एक और तरीका है?

$(document).ready(function(){ 

$('.submit').click(function(){ 
    validateForm(); 
}); 

function validateForm(){ 

    var nameReg = /^[A-Za-z]+$/; 
    var numberReg = /^[0-9]+$/; 
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 

    var names = $('#nameInput').val(); 
    var company = $('#companyInput').val(); 
    var email = $('#emailInput').val(); 
    var telephone = $('#telInput').val(); 
    var message = $('#messageInput').val(); 

    var inputVal = new Array(names, company, email, telephone, message); 

    var inputMessage = new Array("name", "company", "email address", "telephone number", "message"); 

    $('.error').hide(); 

     if(inputVal[0] == ""){ 
      $('#nameLabel').after('<span class="error"> Please enter your ' + inputMessage[0] + '</span>'); 
     } 
     else if(!nameReg.test(names)){ 
      $('#nameLabel').after('<span class="error"> Letters only</span>'); 
     } 

     if(inputVal[1] == ""){ 
      $('#companyLabel').after('<span class="error"> Please enter your ' + inputMessage[1] + '</span>'); 
     } 

     if(inputVal[2] == ""){ 
      $('#emailLabel').after('<span class="error"> Please enter your ' + inputMessage[2] + '</span>'); 
     } 
     else if(!emailReg.test(email)){ 
      $('#emailLabel').after('<span class="error"> Please enter a valid email address</span>'); 
     } 

     if(inputVal[3] == ""){ 
      $('#telephoneLabel').after('<span class="error"> Please enter your ' + inputMessage[3] + '</span>'); 
     } 
     else if(!numberReg.test(telephone)){ 
      $('#telephoneLabel').after('<span class="error"> Numbers only</span>'); 
     } 

     if(inputVal[4] == ""){ 
      $('#messageLabel').after('<span class="error"> Please enter your ' + inputMessage[4] + '</span>'); 
     }  
} 

}); 

Answer 1

के लिए email : true परिभाषित कर सकते हैं आप बस the jQuery Validate plugin उपयोग कर सकते हैं इस प्रकार कई और अधिक संपत्ति है।

jQuery:

$(document).ready(function() { 

    $('#myform').validate({ // initialize the plugin 
     rules: { 
      field1: { 
       required: true, 
       email: true 
      }, 
      field2: { 
       required: true, 
       minlength: 5 
      } 
     } 
    }); 

}); 

एचटीएमएल:

<form id="myform"> 
    <input type="text" name="field1" /> 
    <input type="text" name="field2" /> 
    <input type="submit" /> 
</form> 

डेमो: http://jsfiddle.net/xs5vrrso/

विकल्प:http://jqueryvalidation.org/validate

तरीके:http://jqueryvalidation.org/category/plugin/

स्टैंडर्ड नियम: http://jqueryvalidation.org/category/methods/

वैकल्पिक नियम additional-methods.js file साथ उपलब्ध:

maxWords 
minWords 
rangeWords 
letterswithbasicpunc 
alphanumeric 
lettersonly 
nowhitespace 
ziprange 
zipcodeUS 
integer 
vinUS 
dateITA 
dateNL 
time 
time12h 
phoneUS 
phoneUK 
mobileUK 
phonesUK 
postcodeUK 
strippedminlength 
email2 (optional TLD) 
url2 (optional TLD) 
creditcardtypes 
ipv4 
ipv6 
pattern 
require_from_group 
skip_or_fill_minimum 
accept 
extension 

Answer 2

आपको लगता है कि के लिए jQuery सत्यापनकर्ता उपयोग कर सकते हैं लेकिन आप उस के लिए jquery.validate.js और jquery.form.js फ़ाइल जोड़ने की जरूरत है। सत्यापनकर्ता फ़ाइल समेत आपके सत्यापन को इस तरह कुछ परिभाषित करें।

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#formID").validate({ 
    rules :{ 
     "data[User][name]" : { 
      required : true 
     } 
    }, 
    messages :{ 
     "data[User][name]" : { 
      required : 'Enter username' 
     } 
    } 
    }); 
}); 
</script> 

आप required : true ही देख सकते हैं वहाँ की तरह ईमेल के लिए संख्या number : true