Get ‘Nan’ when auto calculate

I am creating a form using Gridview in ASP.NET. When the user fills in Qty and Price it needs to automatically calculate the Total. However, my Total always returns Nan (Not a number). What am I doing wrong?

The ASP page looks like this:

  <asp:GridView ID="GridView1" runat="server"
 AutoGenerateColumns="false">
         <Columns>
             <asp:BoundField DataField="Item" HeaderText="Item" />
             <asp:BoundField DataField="Price" HeaderText="Item_Desc" ItemStyle-CssClass="price" />
            <asp:TemplateField HeaderText="Jumlahdatang" >
                 <ItemTemplate  >
                      <asp:TextBox ID="Qty" runat="server"  ></asp:TextBox> 
                 </ItemTemplate>
              </asp:TemplateField>

              <asp:TemplateField HeaderText="Harga Satuan" >
                 <ItemTemplate>
                     <asp:TextBox ID="price" runat="server"    ></asp:TextBox>
                 </ItemTemplate> 
              </asp:TemplateField>

              <asp:TemplateField HeaderText="Harga Total"  >
                 <ItemTemplate >
                     <asp:Label ID="total" runat="server" Text="0" ></asp:Label>

                 </ItemTemplate>

              </asp:TemplateField>
         </Columns>
     </asp:GridView>

The JavaScript:

 <script type="text/javascript"
 src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 <script type="text/javascript">
 // give value 0 first time 
     $(function() {
         $("[id*=Qty]").val("0");
         $("[id*=price]").val("0");
         $("[id*=total1]").val("0");
     });
 //check data must number on Qty
     $("[id*=Qty]").live("change", function() {
         if (isNaN(parseInt($(this).val()))) {
             $(this).val('0');
         } else {
             $(this).val(parseInt($(this).val()).toString());
         }
     });
  //check data must number on price
     $("[id*=price]").live("change", function() {
         if (isNaN(parseInt($(this).val()))) {
             $(this).val('0');
         } else {
             $(this).val(parseInt($(this).val()).toString());
         }
     });

     $("[id*=price]").live("keyup", function() {
         if (!jQuery.trim($(this).val()) == '') {
             if (!isNaN(parseFloat($(this).val()))) {
                 var row = $(this).closest("tr");
                 $("[id*=total]", row).html(parseFloat($(".Qty", row).html()) * parseFloat($(this).val()));
             }
         } else {
             $(this).val('');
         }

     });

Answer

if (isNaN(parseInt($(this).val()))) {

why are you using isNan and parseInt at the same time ?

i think is should be :

if (isNaN($(this).val()))

which returns true if val = string and false if number

another one.. you only need to parseInt if you will use their value in a formula ..

Advertisement

Answer