JQuery Validation not working if select box option changed

Question

I have a form on submitting of which i check if certain type of option is selected my validation changes according to it but its not working somehow can any body help me Here is my HTML of form:


        
            
                ( Note:Fields marked with * are required )
            
            
                 

            
            
                * Size Type: 
                
                   
                
            
            
                
                    
                        
                            
                                * Name: 
                            
                            
                                
                                                                Please enter name
                            
                        
                        
                            * Code: 
                            
                                       
                                                           Please enter code
                            
                        
                        
                            * Num Code: 
                            
                               
                                                           Please enter num code
                            
                        
                    
                                        
                        
                            
                                * Width: 
                            
                            
                                
                            
                        
                        
                            * Height: 
                            
                                       
                            
                        
                    
                
                        
            
                Status: 
                
                    Active
                    Inactive

On Selectbox change i hide certain fields of form also reset my form if any validation was previously done:

function getForm(id)
{
        var validator = $("#addnews").validate();
        validator.resetForm();
    if(id == 1)
    {
        $("#templateForm").attr("style","display:none;");
        $("#wallartForm").attr("style","display:block inline;");

    }
    else
    {
        $("#templateForm").attr("style","display:block inline;");
        $("#wallartForm").attr("style","display:none;");


    }
}

This is my validation function:

function check(type){


            if(type == "T"){

            $('#addnews').validate({
            rules: {
                name:{required:true},
                code:{required:true},
                num_code:{required:true}
            },
            messages:{
                name:{required:"
Please enter size name"},
                code:{required:"
Please enter size code"},
                num_code:{required:"
Please enter size num code"}
            }
        });
            }
            else{
                alert("yes")
                $('#addnews').validate({
            rules: {
                width:{required:true},
                height:{required:true}

            },
            messages:{
                width:{required:"
Please enter width"},
                height:{required:"
Please enter height"}

            }
        });

            }


        }

The Validation applies on Template Selection but not working on wallart Selection

politus · Accepted Answer

This is a lot easier than you think - the jQuery validate plugin ignores hidden fields by default, giving you the functionality you need 'out of the box'. What you need to do is

firstly make sure you have a version of the plugin >= 1.9.0, then

set up your validation for the whole form
hide and show the two parts of the form with your getForm(...) function
let jQuery validate do the rest

(so you don't need your check(...) function)

keeping your html the same, replace your script with this

JQuery Validation not working if select box option changed

Answers (1)

Related Questions