Jquery form submit validation

问题

I have following form:

<form id="testForm" action="country_Save">
   Country Name:<input type="text" id="countryName" />  
   <input type="submit" id='saveCountry' value="Add Country" />
</form>

and following JQuery for validating textfield

$('#testForm')
   .jqxValidator({  rules : [
          {
              input : '#countryName',
              message : 'Country Name is required!',
              action : 'keyup, blur',
              rule : 'required'
          }],
          theme : theme
});

How can i use this validation when I am submitting a form?

回答1:

Try this please:

     $('#testForm').on('submit', function() {
         return $('#testForm').jqxValidator('validate');
     });

回答2:

Bind a function to the submit event of the form. Return false in this function if any of the form fields fail validation.

For example:

$('form').on('submit', function() {
    // do validation here
    if(/* not valid */)
        return false;
});

回答3:

Form validation have a wide set of Javascript and jQuery libraries... My sugestion is a simple jquery.com plugin.

PS: jqxValidator is a method from the jQWidgets framework? if you (reader) not need so heavy/complex plugin, see bellow pure jQuery, else @Gajotres writed the best solution (!).

Using only jQuery and basic Javascript.

For both, "plug library" and "writing your own validation methods", first check if the direct use of jQuery is what you need.

Here a code that do all what the question say to need: validation on blur, keyup and "when submitting".

function validate(){
    var cnv = $('#countryName').val();
    if (!$.trim(cnv)) {
        alert('Country Name is required!');
        return false;
    } else { return true; }
}

$('#testForm').submit(validate);
$('#countryName').bind('blur keyup', validate);

来源：https://stackoverflow.com/questions/13541133/jquery-form-submit-validation

标签

jquery

validation

jqxwidgets