validate a subset of the input elements

Question

I have started using jQuery Validation plugin 1.7.

I have a wizard like interface that collect input for several view model classes. I am trying to validate every object showed in a step every time the user click on the NEXT/PREVIOUS button.

My jquery code is like this one

$w.bind("jwizardchangestep", function (event, ui) {
    if (ui.type !== "manual") {
        var $currentStep = $w.find(".jw-step:eq(" + ui.currentStepIndex + ")");
        var $inputs = $currentStep.find("input:text");

        if ($inputs.length > 0 && !$inputs.valid()) {
            $currentStep.find("label.error").effect("highlight");
            return false;
        }
    }
});

where $inputs contains a reference to all the input boxes in the page.

Anyway the function $inputs.valid() always return true even if the input elements have not be filled at all. I am suspecting that something is wrong with the validation rules that I specify in another jQuery call like this one

$("#registerForm").validate({
    rules: {
        Firm_Name: "required",
        Firm_StreetAddress: "required",
        Firm_ZipCode: "required",
        Firm_City: "required"
    }
});

This is a sample markup code of an input box

<input id="Firm_Name" name="Firm.Name" style="width: 460px;" type="text" value="" class="ui-widget-content">

I'm trying to create a wizard too, but I don't know how to persist the state of my viewModel across the different steps of the wizard. Would you tell me how you've managed to do it ? I've created a thread here http://stackoverflow.com/questions/14769005/asp-net-mvc-updating-model-as-user-progress-through-wizard — Sam, Feb 08 '13 at 11:53

score 1 · Answer 1 · answered Nov 07 '10 at 15:12

1

try using names

$("#registerForm").validate({
    rules: {
        Firm.Name: "required",
        Firm.StreetAddress: "required",
        Firm.ZipCode: "required",
        Firm.City: "required"
    }
});

answered Nov 07 '10 at 15:12

Aivan Monceller

4,636
10
42
69

score 0 · Accepted Answer · answered Nov 07 '10 at 21:57

I have got it working using rules in metadata.

It seems that the call

$("#registerForm").validate({
    rules: {
        Firm_Name: "required",
        Firm_StreetAddress: "required",
        Firm_ZipCode: "required",
        Firm_City: "required"
    }
});

will setup the rules to be checked at submit time which is not properly what I wanted to do because I wanted to validate on every wizard next button click.

Using rules in metadata as

<input id="Firm_Name" name="Firm.Name" 
    style="width: 460px;" type="text" value="" 
    class="required ui-widget-content">

works very nice. Thanks everybody for helping

validate a subset of the input elements

2 Answers2