Jquery function is not working for dynamically added rows in gridview

0
votes

I have a gridview with dynamically added rows. I need to do some calculation using jquery when textbox changed. Below is my jquery function .But it is not firing . Is there any other method to find the controls. Please help 

   <script>
    $(function () {
        $('#<%=gvConsumableUsageAdd.ClientID %>').find('input:text[id$="txtQuantity"]').keyup(function () {
            debugger;
            var price = $('#<%=gvConsumableUsageAdd.ClientID %>').find('span[id$="lblUnitPrice"]').text();
            var qty = $('#<%=gvConsumableUsageAdd.ClientID %>').find('input:text[id$="txtQuantity"]').val();
            var total = parseFloat(price * qty);
            $('#<%=gvConsumableUsageAdd.ClientID %>').find('span[id$="lbtTotalAmount"]').text(total.toFixed(2));
        });
    });
</script>

Thanks in Advance

2
javascriptjqueryasp.netgridview
might be helpful stackoverflow.com/questions/27976739/… - Mritunjay
what is debugger? that line is literally not doing anything except perhaps throwing an error (causing your script to fail) - winhowes

2 Answers

0
votes
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">

    $("[id*=txtQuantity]").live("keyup", function () {            
        if (!jQuery.trim($(this).val()) == '') {
            if (!isNaN(parseFloat($(this).val()))) {
                var row = $(this).closest("tr");
                var Quantity = parseFloat($(this).val());
                var unitPrice = parseFloat($("[id*=lblUnitPrice]", row).html());
                var Total = Quantity * unitPrice;
                $("[id*=lbtTotalAmount]", row).html(Total);
            }
        }
    }
 );
</script>

I found the solution using the above function. Thank you

0
votes

As you already solved your problem with above given answer, but here a improvements, you have used .live() method which is deprecated in jQuery latest version.

Instead of .live() use .on() to attach event handlers. Improved code would be look like

$('#<%=gvConsumableUsageAdd.ClientID %>').on('input', '[id*=txtQuantity]', function () {
    var self = $(this);
    if (!jQuery.trim(self.val()) == '') {
        if (!isNaN(parseFloat(self.val()))) {
            var row = self.closest("tr");
            var Quantity = parseFloat(self.val());
            var unitPrice = parseFloat($("[id*=lblUnitPrice]", row).html());
            var Total = Quantity * unitPrice;
            $("[id*=lbtTotalAmount]", row).html(Total);
        }
    }
});