how to get value of input type from dynamic table using 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..

Community · Accepted Answer · 2017-05-23 11:53:32Z

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

edited May 23, 2017 at 11:53

CommunityBot

11 silver badge

answered Feb 24, 2016 at 15:37

Ole Fredrik Borgundvåg Berg

886 bronze badges

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

5 Comments

mohammad haris Over a year ago

I have tried this before but getting quantity undefined.

mohammad haris Over a year ago

kindly check my below answer and let me know if I can use quantity script with .eq syntax

Ole Fredrik Borgundvåg Berg Over a year ago

Seems like value is in the input tag, and not in the td tag you get through your .eq syntax. That means that you have to get the input tag out of the td tag. quantity = $tds.eq(4).children("input").val(); might work.

mohammad haris Over a year ago

As I have mentioned earlier , it is dynamic table , so it is necessary that input type should be in td

Ole Fredrik Borgundvåg Berg Over a year ago

Try quantity = $tds.eq(4).children("input").val(); if you want to keep your .eq syntax.

charu joshi · Accepted Answer · 2016-08-09 18:41:26Z

1

replace this:

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

with

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

answered Aug 9, 2016 at 18:41

charu joshi

1131 silver badge12 bronze badges

Comments

mohammad haris · Accepted Answer · 2016-02-24 15:40:34Z

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.

Collectives™ on Stack Overflow

how to get value of input type from dynamic table using jquery

3 Answers 3

5 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related