如何使用jQuery从动态表中获取输入类型的值

Question

I am working on ecommerce website.

My table gets value from session. It looks like :

On Checkout I want to get all the values of table.

I have used jquery for this.

Here is my code:

<script>
$('#chhk').on('click',function(e) {
                    e.preventDefault();
                    alert('click');
                var table = $("#tbl tbody");

                 table.find('tr').each(function (i, el) {
                    var $tds = $(this).find('td'),
                        product = $tds.eq(2).text(),
                        price = $tds.eq(3).text(),
                        quantity = $tds.eq(4).attr('value'),
                        total = $tds.eq(5).text();

                     alert('Row ' + (i + 1) + ':\nProduct: ' + product
                          + '\nPrice: ' + price
                           + '\nQuantity: ' + quantity
                          + '\nTotal: ' + total);
                });

            });
</script>

Here '#chhk' is checkout button id

'#tbl' is my table id

I am getting blank value of quantity by this script as it is input field

Any help would be appreciated..

Answer 1

Try replace this:

                    quantity = $tds.eq(4).attr('value');

with:

                    quantity = $tds.eq(4).val();

As .attr('value') gives the value at the start, while .val() gives current property.

More info: jQuery .val() vs .attr("value")

Answer 2

replace this:

 quantity = $tds.eq(4).attr('value'),

with

quantity = $tds.eq(4).find("input").val(),

Answer 3

well I tried to do it separately and am getting expected result.

$('#chhk').on('click',function(e) {
                e.preventDefault();
                alert('click');
            var table = $("#tbl tbody");

             table.find('tr').each(function (i, el) {
                var $tds = $(this).find('td'),
                    product = $tds.eq(2).text(),
                    price = $tds.eq(3).text(),
                    total = $tds.eq(5).text();
                    var qty = $(this).find('td input:first').val();

                 alert('Row ' + (i + 1) + ':\nProduct: ' + product
                      + '\nPrice: ' + price
                      + '\nTotal: ' + total
                      +'\n Qua:' + qty);
            });

        });

Have dealed quantity separately.