How can i get checked row input field value in JavaScript?

Question

i have one data table in that one column set as input field so i need all input field value that row check box is checked

i try this one but in that i get only other text data, i not get input field data

var values = new Array();

$.each($(".admin__control-checkbox:checked").closest("td").siblings("td"),
    function() {
        values.push($(this).text());
        $("#qty").each(function() {
            values.push($(this).val());
        });



    });

alert("val---" + values.join(", "));

Answer 1

One problem seems to be that you don't have any event that runs when you change the checkbox.

I've made a small example, that will show how this can be done given the code you provided.

$(".admin__control-checkbox").change(function() {
  var values = new Array();
  $(".admin__control-checkbox:checked").each(function() {
    var v = $(this).closest("tr").find(':input[type="number"]').val() || 0
    values.push(v)
  });
  alert("val---" + values.join(", "));
})

Demo

 $(".admin__control-checkbox").change(function() { var values = new Array(); $(".admin__control-checkbox:checked").each(function() { var v = $(this).closest("tr").find(':input[type="number"]').val() || 0 values.push(v) }); alert("val---" + values.join(", ")); })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tbody> <tr> <td> <input type="checkbox" class="admin__control-checkbox" /> </td> <td>test</td> <td> <input type="number" value="1"> </td> </tr> <tr> <td> <input type="checkbox" class="admin__control-checkbox" /> </td> <td>test</td> <td> <input type="number" value="2"> </td> </tr> <tr> <td> <input type="checkbox" class="admin__control-checkbox" /> </td> <td>test</td> <td> <input type="number" value="3"> </td> </tr> </tbody> </table>

Answer 2

First of all, you should give a unique value like ID to all checkboxes. After that, you have to create an id with the unique value you give to your checkboxes. You can loop all the checked checkboxes with each and get the values of the ID inputs with their values.

 var myValues = []; $('input[name="test"]:checked').each(function() { myValues.push($('#input-'+this.value).val()); }); console.log('MY VALUES: ', myValues);

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tr> <td><input type="checkbox" checked name="test" value="1"/></td> <td>Test</td> <td>Test</td> <td><input type="text" id="input-1" value="test input value" /></td> </tr> <tr> <td><input type="checkbox" checked name="test" value="2"/></td> <td>Test</td> <td>Test</td> <td><input type="text" id="input-2" value="test input value" /></td> </tr> <tr> <td><input type="checkbox" name="test" value="3"/></td> <td>Test</td> <td>Test</td> <td><input type="text" id="input-3" value="" /></td> </tr> </table>

Answer 3

you can add a class or attribute to the textbox when the checkbox is clicked, then just select all the textboxes with specific class.

for example, $(".checkedQuantity")

or

var checkedItems = $(".admin__control-checkbox:checked");
for (var i = 0; i < checkedItems.length; i++) {
    var currentTextbox = $(checkedItems[i]).parent("tr").find(".qty");
    console.log(currentTextbox .val());
}

do not use same id for multiple elements, i changed #qty to.qty