Error validation using jquery on all input field only checking once

Question

I have a bunch of input fields with the same class name and a custom data variable assigned to each. The purpose of the custom variable is to be used to later identify and assign the input value in to another JS object.

Code looks like something like this.

function moveStepOnetoStepTwo(){

//Go thru each item id input field
$('.inputfields').each(function(){
    var attr_userid = $(this).data('userid'); //get item ID from custom data attr val
    var attr_final_bid = $(this).val();

    //Let's do some error checks with input
    attr_final_bid = attr_final_bid.trim();
    if(empty(attr_final_bid) == true){
        $(this).css({"border-color": "red",
                    "border-width":"2px",
                    "border-style":"solid"});
        //Alert the user
        alert("Please enter a valid value before proceeding to Step 2");
        return false;
    }
    else{

        //Go thru the master list
        $.each(item_checkout_master_list, function(){
            if(this.itemID == attr_userid){
                this.final_bid = attr_final_bid;
            }
        });

        console.log(item_checkout_master_list);
        //if pass move to tab 2
        $('#tab1_box').hide();
        $('#tab3_box').hide();
        $('#tab2_box').show();
        $('#myTab li:eq(1) a').tab('show');
    }
});
}

For some odd reason it only does the error check once, and if I call function moveStepOnetoStepTwo() again. Even if another input field is empty it still proceeds with the else actions.

Any help on this would be greatly appreciated! Thank you.

Gillis Haasnoot · Accepted Answer · 2014-12-08 17:03:14Z

Maybe it is better to create a separate validation method.

so you will have something like this

function moveStepOnetoStepTwo() {

    if (!validateInput()) {
        console.log("wrong input");
        alert("bad input");
        return
    }

    //continue to move to step 2
    //Go thru the master list
    $.each(item_checkout_master_list, function() {
        if (this.itemID == attr_userid) {
            this.final_bid = attr_final_bid;
        }
    });

    console.log(item_checkout_master_list);
    //if pass move to tab 2
    $('#tab1_box').hide();
    $('#tab3_box').hide();
    $('#tab2_box').show();
    $('#myTab li:eq(1) a').tab('show');
}

function validateInput() {

    var validateOk = true;

    $('.inputfields').each(function() {
        var attr_userid = $(this).data('userid'); //get item ID from custom data attr val
        var attr_final_bid = $(this).val();

        //Let's do some error checks with input
        attr_final_bid = attr_final_bid.trim();
        if (empty(attr_final_bid) == true) {
            $(this).css({
                "border-color": "red",
                "border-width": "2px",
                "border-style": "solid"
            });
            validateOk = false;
        }
    });

    return validateOk;
}

Collectives™ on Stack Overflow

Error validation using jquery on all input field only checking once

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related