如何动态更改mvc3 html页面中的值

时间:2011-09-23 15:04:49

标签: html asp.net-mvc-3 razor

        <tr> 
           <td>
               Delivery
           </td>
            <td>
               <div class="confdelivery">
                    <select id="NxtDay" name="NxtDay">
                         <option selected="selected" value="1">Normal Devliery + 10.00</option>
                            <option value="2">Next Day Delivery + 20.00</option>
                        </select>
                    </div>
                </td>
            </tr>
             <tr>
                <td>
                    Total
                </td>
                <td> 
                     @{
                var total = Model.CartTotal;
             }
            @total
                </td>
            </tr>

基本上,如果用户选择第二天发货。我想将20添加到@total?

1 个答案:

答案 0 :(得分:3)

我认为你这是错误的方式。您可以使用javascript更新某些输入值,也可以使用控制器操作中的NxtDay值来指定正确的值,具体取决于选择。

<强>增加:

你想要做的是这样的事情:(我假设你使用的是jquery,因为它带有MVC3)。

但是:如果你要开始,你应该查看一些教程。这是非常基本的东西,你不会在没有回到这里的情况下走得更远,除非阅读这个sutff。

<tr> 
   <td>
       Delivery
   </td>
    <td>
       <div class="confdelivery">
            <select id="NxtDay" name="NxtDay">
                <option selected="selected" value="10">Normal Devliery + 10.00</option>
                <option value="20">Next Day Delivery + 20.00</option>
            </select>
        </div>
    </td>
</tr>
 <tr>
    <td>
        Total
    </td>
    <td> 
        <span id="totalValue" style="display: none">@Model.CartTotal</span>
        <span id="totalWithShipping">0</span>
       <input id="hiddenTotal" type="hidden" value="0">
    </td>
</tr>

<script>
    $(document).ready(function () {
        $('#NxtDay').change(function() {
            addToTotal();
        });
    });
    function addToTotal(){
        $('#totalWithShipping').html($('#totalValue').html() + $("#NxtDay option:selected").val());
        $('#hiddenTotal').val($('#totalWithShipping').html());
    }
</script>
相关问题