Как показать общее количество динамически добавленных столбцов с помощью jquery

Question

Я сделал корзину покупок, где я добавил строку, основанную на поиске автозаполнения. и на основе изменения цены. Но я хочу найти общее количество промежуточных результатов. Я написал часть обновления. Но вместо фактического значения он показывает 0. Может ли кто-нибудь помочь мне узнать, что не так в моем коде jQuery ... Спасибо!

$('#searchName').autocomplete({ 
       source: '{!! asset('nameAutocomplete') !!}', 
       select:function(suggestion,ui){ 
        event.preventDefault();  
         var $tbody = $('#example tbody'); 
         $tbody.append('<tr><td class="id">' + ui.item.id + 
         '</td><td class="name">' + ui.item.value + 
         '</td><td class="price">' + ui.item.price + 
         '</td><td><input type="text" class="quantity" value="1"/></td><td><input type="text" class="total" readonly value="'+ui.item.price+'" class="readonly"/></td></tr>'); 
         $('.quantity').on('keyup',function(){ 
          var tot = $(this).parent().prev().html() * this.value; 
          $(this).parent().next().find('.total').val(tot); 
         console.log(calculateSum());  
         }); 
         function calculateSum(){ 
         var sum = 0; 
        $(".total").each(function() { 
         var value = $(this).text(); 
         // add only if the value is number 
         if(!isNaN(value) && value.length != 0) { 
          sum += parseFloat(value); 
         } 
         }); 
        return sum; 
        }    
        }     
      }); 

Вот таблица часть:

<table class="table table-striped table-bordered" id="example"> 
        <thead> 
         <tr>      
         <td>ID</td> 
         <td>Name</td> 
         <td>Price</td> 
         <td>Quantity</td> 
         <td>Total</td>      
         </tr> 
        </thead> 
        <tbody> 
        </tbody> 
        </table> 

Answer 1

$(".total") является входным сигналом, так что вы должны использовать var value = $(this).val();, не var value = $(this).text();