Jquery Validation On Rows

I have a form that I need to validate on my page. The form looks like this: I am trying to figure out the best way to make sure that if one piece of information in the row is fill

Solution 1:

You have to manually do this. I am not going to write whole code for you but it will be something like this.

//on hove of each td
        $('#tableID tr td').hover(function(){
//loop each its sibling
           $(this).siblings().each(function(//if any sibling is empty return false if($(this).val().trim() == '')
                 {
                   returnfalse;
                 }
           ));
//else return truereturntrue;
        });

Solution 2:

Possible solution:

$("#mytable tr").each(function() {
    var anySet = false, allSet = true;
    $(this).find("td input").each(function() {
        var somethingInCell = $(this).val().trim() !== '';
        anySet |= somethingInCell;
        allSet &= somethingInCell;
    });
    if (anySet && !allSet) {
        // there is missing information
    }
});

UPDATE

    $("#mytable").on("input", "input", function(){
        var anySet = false,
            $cells = $(this).closest("tr").find("td input");
        $cells.each(function() {
            var somethingInCell = $(this).val().trim() !== '';
            anySet |= somethingInCell;
        });
        $cells.removeClass("has-error");
        if (anySet) {
            $cells.each(function() {
                if ($(this).val().trim() === '') {
                    $(this).addClass("has-error");
                }
            });
        }
    });