Select multiple records using a jquery condition

Asked

Viewed 48 times

-1

I have a table that has some empty columns, I want to select only the rows whose content is complete. In my example you are selecting all, not respecting the content.

    $("#selectAllOS").click(function () {

        if ($('#selectAllOS').is(':checked')) {

            $.each($("#gridOS tbody tr"), function (index, value) {
                //conteúdo da coluna 3
                var conteudo = $(this).find('td:eq(3)').html();
                var check = $(this).find('td:eq(0)').html();
                if (conteudo !== "") {
                    //checkbox apenas nas colunas com o conteúdo completo
                    $('input[type="checkbox"]').prop("checked", true);
                } 
            });

        } else {
            $('input[type="checkbox"]').prop("checked", false);
        }

    });
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>

<table id="gridOS" border="1" style="width:100%">

    <thead>
        <tr>
            <th><input type="checkbox" id="selectAllOS" name="selectAllOS" /></th>
            <th>Name</th>
            <th>Position</th>
            <th>Danfe</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="1" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>8787878787878</td> 
        </tr>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="2" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td></td> 
        </tr>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="3" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>8787878787878</td> 
        </tr>
    </tbody>
</table>

javascript jquery

  • If you want to select the columns, why are you doing $.each of tr? I think you want the full lines, no?

  • @Aurium, I’m making $.each de tr because when I click on selectAllOS, I’m going through the entire table so I take the content to see if that particular line has anything in column 3

  • @Aurium, see that selectAllOS is in the <thead> table, it serves to selects everything at once

  • @Aurium, I posted the solution

1 answer

0


The solution was to do so, which works very well by the way.

          $("#selectAllOS").click(function () {

            if ($('#selectAllOS').is(':checked')) {

                $.each($("#gridOS tbody tr"), function (index, value) {
                    //conteúdo da coluna 3
                    var conteudo = $(this).find('td:eq(3)').html();
                    //conteúdo da linha atual
                    var check = $(this).find('td:eq(0) :input');

                    if (conteudo !== "") {
                        console.log(index);
                        //checkbox apenas nas colunas com o conteúdo completo
                        $(check).prop("checked", true);
                    }
                });

            } else {
                $('input[type="checkbox"]').prop("checked", false);
            }

        });
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>

<table id="gridOS" border="1" style="width:100%">

    <thead>
        <tr>
            <th><input type="checkbox" id="selectAllOS" name="selectAllOS" /></th>
            <th>Name</th>
            <th>Position</th>
            <th>Danfe</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="1" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>8787878787878</td> 
        </tr>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="2" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td></td> 
        </tr>
        <tr>
            <td> <input class="check-os" type="checkbox" data-action="check" value="3" /></td>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>8787878787878</td> 
        </tr>
    </tbody>
</table>

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.