开发者

jQuery Validator: Custom message on type

开发者 https://www.devze.com 2023-02-22 06:58 出处:网络
I\'ve basically got a for loop that loops through a bunch of classes does work, one for checkboxes and one for radio boxes. The fields need to be marked required when selected, or checked (which works

I've basically got a for loop that loops through a bunch of classes does work, one for checkboxes and one for radio boxes. The fields need to be marked required when selected, or checked (which works just fine), I just need to display a custom error message for each type: checkbox and Radio box.

I've tried in the loop/method to do .validate(rules{required: 'Please select an option'}) with no luck. How can I accomplish this?

Code:

// When the DOM is ready
$(document).ready(function() {
            /* To add more boxes to hide/show, add the name of the field to the array, 
                set the box class to that name + Hide, set the class of the field to that name
                then if radio box set value="Yes" Yes must have first letter capitlized */ 
            // storing the class names of the HTML elements we want to mess with
            var hiddenClassArray = [
                        "appliedWorkedYes",
                        "workStudyYes",
                        "workHistoryYes",
                        "workWeekEndsYes",
                        "cprYes",
                        "aedYes",
                        "aidYes",
                        "lifegaurd",
                        "wsiYes",
                        "gaurdYes",
                        "lifegaurdChk",
                        "fitnessChk",
                        "fitPTCYes",
                        "fitGrpYes",
                        "outdoorAdvChk",
                        "challengeChk",
                        "injuryCareChk",
                        "athTrainYes",
                        "serviceCenter",
                        "itDepartmentChk",
                        "marketingChk"
                        ];  

            // looping over each array element, hiding them using jQuery
            for(var i = 0; i < hiddenClassArray.length; i++){
                // jQuery to append a display none. 
                $("."+hiddenClassArray[i]+"Hide").css("display","none");    
            }

            // ************ RADIO & CHECK BOXES ************

        // jQuery's Equlivant of a for each loop, a little fancier then that 
        $.each(hiddenClassArray, function(index, radio) {

            // first is it a Check box? 
            if($("."+radio).is(':checkbox')) {
                // when we click
                $("." + radio).click(function() {
                    // if it's checked show
                    if($("."+ radio).attr('checked')){
                        // show
                        $("." + radio + "Hide").show('fast'); 
                        // make one of the group required
                        $("."+radio + "requried").addClass("required");
                    }
                    // default hide
                    else{ 
                        // hide 
                        $("."+radio + "Hide").hide("fast");
                        // remove the required class attribute
                        $("."+radio + "requried").removeClass("required");
                    }
                }); // ends .click
            } // ends if
            // if it's a radio box
            else if ($("."+radio).is(':radio')) {
                // On click
                $("."+radio).click(function(){
                    // show
                    if($(this).val()==="Yes"){
                      开发者_如何转开发  // show
                        $("."+radio + "Hide").show("fast");
                        // make one of the group required
                        $("."+radio + "requried").addClass("required");
                    }
                    // default, hide
                    else{ 
                        // hide
                        $("."+radio + "Hide").hide("fast");
                        // remove the required class attribute
                        $("."+radio + "requried").removeClass("required");
                    }
                }); // emds .click

            }// ends else
        }); // end .each

    // Validating data 
    $(".empForm").validate();



}); // Ending the $(Doc) Ready  
0

精彩评论

暂无评论...
验证码 换一张
取 消