ASP.NET MVC — получить флажок без идентификатора

#jquery #html #asp.net-mvc

#jquery #HTML #asp.net-mvc

Вопрос:

У меня есть этот код, который создает таблицу, в которой есть флажки, а у моих флажков нет идентификатора, я просто хочу, чтобы они указывали мне имя текущего пользователя в строке, когда они отмечены или сняты, и я пытаюсь сделать это с помощью функции OnChecked, и она не работает.

Это мой код:

  <table id="table" class="table table-bordered table-responsive table-hover table-bordered">

                                        <tr>

                                            <th align="center">Nome</th>
                                            <th align="center">Envia Mensagem</th>
                                            <th align="center">Envia Emails</th>
                                            <th align="center">Remover</th>
                                        </tr>
                                        @foreach (var esp in ViewBag.Json1)
                                        {
                                            <tr>


                                                <td>@esp.Nome</td>
                                                @if (@esp.NotificacaoEmail == "True")
                                                {

                                                    <td align="center"><input class="minimal" onclick="FillBooks(CURRENT LINE NAME);" type="checkbox" checked="checked"></td>
                                                }
                                                else
                                                {
                                                    <td align="center"><input class="minimal" type="checkbox"></td>
                                                }
                                                @if (@esp.NotificacaoAlerta == "True")
                                                {
                                                    <td align="center"><input class="minimal" type="checkbox" checked="checked"></td>
                                                }
                                                else
                                                {
                                                    <td align="center"><input class="minimal" type="checkbox"></td>
                                                }
                                                <td>
                                                    <button type="button" class="btn btn-block btn-danger">Remover</button>
                                                </td>

                                            </tr>
                                        }
                                    </table>
  

Это мой Javascript:

  function myFunction(val) {
        alert(val);

    }
  

Я не получаю предупреждение, когда меняю флажок на true или false, и я не знаю почему, может кто-нибудь помочь мне с этим?

Ответ №1:

Вы можете применить прослушиватель onchange ко всем флажкам в таблице и выяснить, установлен ли он или снят, следующим образом:

 $("#table").on("change", "input[type=checkbox]", function () {
    if ($(this).is(":checked")) {
        // This checkbox was just checked
    } else {
        // This checkbox was just unchecked
    }
});
  

Рабочий фрагмент ниже:

 $("#table").on("change", "input[type=checkbox]", function () {
    var name = $(this).parents("tr").children().first().text();
    if ($(this).is(":checked")) {
        // This checkbox was just checked
        alert(name   " is checked");
    } else {
        // This checkbox was just unchecked
        alert(name   " is unchecked");
    }
});

for (var i = 0; i < 5; i  )
  $("#table").append("<tr><td>Name "   (i   1)   "</td><td><input type="checkbox" /></td></tr>")
  
 setTimeout(function () {
   for (var i = 5; i < 10; i  )
    $("#table").append("<tr><td>Name "   (i   1)   "</td><td><input type="checkbox" /></td></tr>")
 }, 5000)  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="table"></table>  

Комментарии:

1. кажется, это отличный способ сделать это, но он не запускается, я не знаю почему. Я сделал это так: $(document). готово(функция () { $(«#table2»).find(«ввод [тип= флажок]»).on(«изменить», функция () { if ($(this).is(«:проверено»)) { оповещение («проверено») } else { оповещение («снято») } }); }

2. Ваши входные данные или таблица добавляются на страницу динамически? Идентификатор таблицы, который вы используете, отличается от вашего первоначального сообщения там

3. входные данные моей таблицы добавляются динамически

4. Хорошо, я обновил ответ, чтобы он работал с динамическими входами

5. Не уверен, что вам все еще это нужно, но я добавил фрагмент в ответ, который содержит предупреждение при выборе каждого флажка

Ответ №2:

Получить флажок в jQuery как:

 let checkboxes = $("input[type='checkbox']");
//you can debug after like 
console.log(checkboxes);  

итак, в Javascript у вас может быть флажок, подобный:

 let checkboxes = document.querySelectorAll("input[type='checkbox']");
// to debug 
console.log(checkboxes);  

Я надеюсь, что это поможет вам