Search code examples
javascriptc#jqueryunobtrusive-validation

Get the value of all the jquery inputs within a fieldset


this is the first question i ask here. I have a fieldset which has inside 4 inputs. I want to validate the form if at least 2 of 4 are completed. I can get the value of the first input with $("#communications input").val().

 <fieldset class="input-group-fieldset bigger-labels" id="communications">
    <div class="row">
        <div class="columns twelve">
            <div class="input-group" id="pref-mail-wrap">
                <label>Email Address</label>
                @Html.TextBoxFor(model => model.PrefferedEmail, new { @class = "contact-group" })

            </div>
        </div>
    </div>
    <div class="row">
        <div class="columns four">
            <div class="input-group" id="pref-phone-wrap">
                <label>Telephone No</label>
                @Html.TextBoxFor(model => model.PrefferedPhoneNo, new { @class = "contact-group" })



            </div>
        </div>
        <div class="columns four">
            <div class="input-group" id="pref-sms-wrap">
                <label>SMS No</label>
                @Html.TextBoxFor(model => model.PrefferedSmsNo, new { @class = "contact-group" })

            </div>
        </div>
    </div>
    <div class="" id="pref-address-wrap">

        <div class="row fixed-width">
            <div class="columns twelve">
                <div class="input-group2">
                    <label>Address </label>

                    @Html.TextBoxFor(model => model.PostalAddress)

                </div>
            </div>

        </div>

Thank you in advance, Kostas.


Solution

  • Use .filter() as below.

    var $completedInputs = $("#communications input:text").filter(function() {
        //return the ones witn non-empty values
        return $.trim(this.value) != "";
    });
    
    if ($completedInputs.length >= 2) {
        //At least 2 inputs have been filled.   
    }
    

    $("#communications input:text") or $("#communications :text") => All inputs whose type is text

    $("#communications input") => All inputs