Jacob
Jacob

Reputation: 14731

Issues With Jquery Form Validations

I am trying to do form validation using Jquery, unfortunately neither I am not able to display the null field empty message nor I am not able to prevent user from leaving fields blank.

I am using the following query for validations

 $("#frm").validate( {  
                    rules : {  
                        empName : "required"  
                    }  
                });  

I have put a demo here using JSFiddle

Any help is highly appreciable

Upvotes: 2

Views: 7642

Answers (2)

Marcel Gwerder
Marcel Gwerder

Reputation: 8520

You can also use the anchor but then you have to submit the form manually (fiddle). You also shouldn't initialize the validation on a click event. Initialize it on load and then just submit the form to trigger validation.

$(document).ready(function(){
    $("#frm").validate( {  
        ignore: '*:not([name])', //Fixes your name issue
        rules : {  
            empName : "required"  
        },
        messages: {
            empName: {
                required: "Please enter name"
            }
        }  
    });  

    $("#saveB").click(function(){
        $("#frm").submit();    
    });   
});

Or you can also use valid without submit the form (fiddle):

  $("#saveB").click(function(){
        $("#frm").valid();
  }); 

Upvotes: 10

dsgriffin
dsgriffin

Reputation: 68576

It's your anchor causing the problem - namely it's href attribute. My advice would be to use an alternative validation trigger, such as an input like <button>.

Working jsFiddle here.

Upvotes: 1

Related Questions