Question

Hy!

I have a work schedule where the user can choose which days work in a “checklist”. Like the image below:

I’m trying to validate this schedule… if the user select to work on monday, he must insert the time of arrival and the time of departure.
This should happen in the entire form.

What is the best way to do this?

Tks!

EDIT:

The html…

<table class="tabelaDados" id="tbEscalaSemana">
<thead>
    <tr>
        <th>
            dia
        </th>
        <th>
            Trabalha?
        </th>
        <th>
            Entrada <span class="labelAvisoTela">(08:30)</span><a title="Replicar horários" href="#"
                class="iconCopiar" id="btnCopEnt"></a>
        </th>
        <th>
            Saída<span class="labelAvisoTela">(17:30)</span><a title="Replicar horários" href="#"
                class="iconCopiar" id="btnCopSai"></a>
        </th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>
            Seg
        </td>
        <td>
            <input id="chkSeg" type="checkbox" name="chkSeg" />
        </td>
        <td>
            <input name="txtEntSeg" type="text" id="txtEntSeg" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiSeg" type="text" id="txtSaiSeg" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Ter
        </td>
        <td>
            <input id="chkTer" type="checkbox" name="chkTer" />
        </td>
        <td>
            <input name="txtEntTer" type="text" id="txtEntTer" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiTer" type="text" id="txtSaiTer" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Qua
        </td>
        <td>
            <input id="chkQua" type="checkbox" name="chkQua" />
        </td>
        <td>
            <input name="txtEntQua" type="text" id="txtEntQua" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiQua" type="text" id="txtSaiQua" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Qui
        </td>
        <td>
            <input id="chkQui" type="checkbox" name="chkQui" />
        </td>
        <td>
            <input name="txtEntQui" type="text" id="txtEntQui" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiQui" type="text" id="txtSaiQui" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Sex
        </td>
        <td>
            <input id="chkSex" type="checkbox" name="chkSex" />
        </td>
        <td>
            <input name="txtEntSex" type="text" id="txtEntSex" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiSex" type="text" id="txtSaiSex" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Sab
        </td>
        <td>
            <input id="chkSab" type="checkbox" name="chkSab" />
        </td>
        <td>
            <input name="txtEntSab" type="text" id="txtEntSab" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiSab" type="text" id="txtSaiSab" class="campoHora txtSaida" />
        </td>
    </tr>
    <tr>
        <td>
            Dom
        </td>
        <td>
            <input id="chkDom" type="checkbox" name="chkDom" />
        </td>
        <td>
            <input name="txtEntDom" type="text" id="txtEntDom" class="campoHora txtEntrada" />
        </td>
        <td>
            <input name="txtSaiDom" type="text" id="txtSaiDom" class="campoHora txtSaida" />
        </td>
    </tr>
</tbody>

Answer 1

Using your HTML, you can validate it this way:

$('#tbEscalaSemana :checked').closest("tr").find('.campoHora').each(function(){
    if($(this).val() == "") {
        alert("You must provide start/stop times for all days you are working!");
        return(false);
    }
});    

This finds all the checked boxes in your table and then for each one, it finds the parent row and searches for the .campoHora classes within that row. It then iterates through each one of those checking to see if it is non empty.

You can see it work here on your HTML: http://jsfiddle.net/jfriend00/fYdEe/

For your follow-on question, this will check if at least one checkbox in the table is checked:

if ($('#tbEscalaSemana :checked').length == 0) {
    // no checkboxes checked
}

I also added this to the jsFiddle: http://jsfiddle.net/jfriend00/fYdEe/.