使用ListView中的dropdownlist onchange事件更新购物车中的数量并更改另一个文本框

时间:2014-02-27 13:57:01

标签: c# jquery asp.net shopping-cart

我有一个用ASP.NET编写的购物车解决方案。在购物车网页中,我有一个产品列表视图,每个项目的数量都是DropDownList。我想在用户更改数量时更新每个项目的总价格。

<table>
  <tbody>
    <tr>
      <td class="fone">
        <%# Eval("Total")%>
      </td>
        <td class="ftwo">
          <asp:DropDownList ID="lstCount" runat="server"  >
            <asp:ListItem Text="1" Value="1" />
            <asp:ListItem Text="2" Value="2" />
            <asp:ListItem Text="3" Value="3" />
            <asp:ListItem Text="4" Value="4" />
            <asp:ListItem Text="5" Value="5" />
          </asp:DropDownList>
        </td>
      <td class="ffour">
        <%# Eval("Price")%>
      </td>

我写了这个jQuery代码来更新每行的总价格:

$('.ftwo').change(function(){
  var price=$(this).closest('tr').find('.fone').html();
  var quantity =$(this).val();
  $(this).closest('tr').find('.ffour').html(price * quantity);
});

它对我有用。问题是我想更新另一个表中的另一个<td>

 <table class="rtl white">
  <tbody>
     <tr class="first">
     <td class="first">
         <asp:Literal ID="txtSumPrice" runat="server" ></asp:Literal></td>
     </tr>

我该怎么做?

我编写ASP.NET代码以在SumPrice中显示pageLoad,但我希望在用户更改一行数量时更新txtSumPrice

1 个答案:

答案 0 :(得分:1)

在更改事件回调函数上,计算总累计值并将其设置为txtSumPrice字段

$('.ftwo').on('change',function(){
   var price=$(this).closest('tr').find('.fone').html();
   var quantity =$(this).val();
   $(this).closest('tr').find('.ffour').html(price * quantity);
   var totalPrice=parseFloat($('span#txtSumPrice').val())+ parseFloat($(this).closest('tr').find('.ffour').text());
   $('span#txtSumPrice').val( totalPrice);
});

快乐编码:)