Checkbox with External Checkbox

Asked

Viewed 489 times

3

I have a Form with a Dropdownlist with Checkbox inside, and I have an external Checkbox that selects and unchecks all.

My question is this:.

When I uncheck one of the items in Dropdown the "Select All" Checkbox should be unchecked and when I select all items it should be checked. But when I do the events are interacting with each other and are giving error.

Someone knows a way to do it?

This is the Checkbox code Select All.

private void cbSelAll_CheckedChanged(object sender, EventArgs e)
{
    if (cbSelAll.Checked == true)
    {
         //Ao selecionar a flag Selecionar todos marca todos os itens
         for (int i = 0; i < cb.CheckBoxItems.Count; i++)
         {
              cb.CheckBoxItems[i].Checked = true;
         }
    }
    else
    {
        //Ao desmarcar a flag Selecionar todos desmarca todos os itens
        for (int i = 0; i < cb.CheckBoxItems.Count; i++)
        {
            cb.CheckBoxItems[i].Checked = false;
        }
    }
}
  • As you added checkbox within the DropDownlist ?

  • Using a control called Checkboxcombobox

  • would be this?

  • 2

    Yes it would be, but the control doesn’t have much to do with the question, I managed to find the answer. I was using the Event when the checkbox was scheduled so one event influenced the other so I changed the event to click and it worked :) but thanks for the help

2 answers

0

Flag to know when the event is being triggered by another, and not be processed:

    bool processando = false;
    private void cbSelAll_CheckedChanged(object sender, EventArgs e)
    {
        if (!processando)
        {
            processando = true;

            if (cbSelAll.Checked == true)
            {
                //Ao selecionar a flag Selecionar todos marca todos os itens
                for (int i = 0; i < cb.CheckBoxItems.Count; i++)
                {
                    cb.CheckBoxItems[i].Checked = true;
                }
            }
            else
            {
                //Ao desmarcar a flag Selecionar todos desmarca todos os itens
                for (int i = 0; i < cb.CheckBoxItems.Count; i++)
                {
                    cb.CheckBoxItems[i].Checked = false;
                }
            }


            processando = false;
        }

    }

Put the if:

if (!processando)
{
  processando = true;
//Processo
  processando = false;
}

within the other events also.

-2

The best I found, simpler and more direct was this:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script type="text/javascript">
    /*
    // MARCA/DESMARCA TODOS OS CHECKBOX DE UMA VEZ
    */
    $(document).ready(function() {
        $('#todos').click(function() {
            var val = this.checked;
            $('.lista').each(function() {
                $(this).prop('checked', val);
            });
        });
    });
</script>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>
                    <input id="todos" type="checkbox">
                </th>
                <th scope="col" style="text-align: center;">ID.</th>
                <th scope="col" style="text-align: center;">Nome</th>
                <th scope="col" style="text-align: center;">Localização</th>
            </tr>
        </thead>

        <tbody>
            <tr>
                <td class=" colunaCheck">
                    <input class="lista" value="opcao1" type="checkbox">
                </td>
                <td> 1</td>
                <td>Sophia Sueli Oliveira</td>
                <td>Porto Alegre - RS</td>
            </tr>
            <tr>
                <td class="colunaCheck">
                    <input class="lista" value="opcao2" type="checkbox">
                </td>
                <td> 2</td>
                <td>Nathan Ricardo Costa</td>
                <td>Campo Grande - MS</td>
            </tr>
            <tr>
                <td class="colunaCheck">
                    <input class="lista" value="opcao3" type="checkbox">
                </td>
                <td> 3</td>
                <td>Sérgio Osvaldo Caleb Almada</td>
                <td>Belém - PA</td>
            </tr>
            <tr>
                <td class="colunaCheck">
                    <input class="lista" value="opcao4" type="checkbox">
                </td>
                <td> 4</td>
                <td>Enzo Vinicius Paulo da Paz</td>
                <td>Franca - SP</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

It’s very simple and intuitive. The first Checkbox, the one that marks/unchecks the others receives the id="todos" and those to be marked/unmarked class="lista".

Browser other questions tagged

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