ASP.NET MVC - Get Checkbox without ID

Question

I have this code that creates a Table that has checkboxes in it and my checkboxes have no ID, i just want them to give me the name of the current person on the row when they are checked or unchecked and I am trying to do this with a OnChecked function and it isn't working.

This is my code:

 <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>

This is my Javascript:

 function myFunction(val) {
        alert(val);

    }

I don't get the alert when I change the Checkbox to true or false and I don't know why, can someone help me with this?

mylee · Accepted Answer · 2019-04-25 09:02:53Z

1

You can apply an onchange listener to all the checkboxes in the table and find out if it is checked or unchecked like this:

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

Working snippet below:

$("#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>

edited Apr 25, 2019 at 9:02

answered Apr 22, 2019 at 16:30

mylee

1,3531 gold badge9 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Mingo Bille Over a year ago

seems like an excelent way to do it but it isn't triggering, I don't know why. I did it like this: $(document).ready(function () { $("#table2").find("input[type=checkbox]").on("change", function () { if ($(this).is(":checked")) { alert("checked ") } else { alert("unchecked ") } }); }

mylee Over a year ago

Is your inputs or table added to the page dynamically? The table ID you're using is different from your initial post there

Mingo Bille Over a year ago

the inputs of my table are added dynamically

mylee Over a year ago

Ah okay, I've updated the answer to work for dynamic inputs

mylee Over a year ago

Not sure if you still need this, but I have added a snippet in the answer which has the alert when each checkbox is selected

|

rapaelec · Accepted Answer · 2019-04-22 16:22:41Z

0

Get checkbox in jQuery like:

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

so in Javascript you can have checkbox like:

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

I hope it's help you

answered Apr 22, 2019 at 16:22

rapaelec

1,34012 silver badges11 bronze badges

Collectives™ on Stack Overflow

ASP.NET MVC - Get Checkbox without ID

2 Answers 2

9 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related