ajax更新时DropdownList的重复列表?

时间:2013-08-01 05:33:19

标签: asp.net-mvc-3 jquery

我有一个 Ajax Jquery 函数:

function UpdateValue() {
$(document.body).on("change",".quantity", function () {
    var ProID = $(this).attr("data");
    var Quantity = $(this).val();
    $.ajax({
        type: "GET", url: "/Cart/UpdateValue",
        data: { ProID: ProID, quantity: Quantity },
        success: function (data) {
            $("#cartbox").html(data);
        }
    }
        );
    $.ajaxSetup({
        cache: false
    });
});
}

在购物车控制器中调用UpdateValue:

public PartialViewResult UpdateValue(Cart cart,int ProID, int quantity)
    {
        List<SelectListItem> items = new List<SelectListItem>();
        for (int i = 1; i <= 10; i++)
        {
            items.Add(new SelectListItem { Text = i.ToString(),
                                           Value = i.ToString() });
        }
        ViewBag.Items = items;
        Product product = repository.Products.FirstOrDefault(p => p.ProductID 
                                                                   == ProID);
        if (product != null)
        {
            cart.UpdateItem(product, quantity);
        }
        CartIndexViewModel ptview = new CartIndexViewModel { Cart = cart,
                                                                 ReturnUrl = "/" };
        return PartialView(ptview);
    }

当ajax功能成功时,它返回 UpdateValue View 。但Dropdown列表在每行中的更改总是相同。如何在ajax更新后从索引视图传递选定的值?

这是我的UpdateValue查看代码:

<table id="cartbox">
        <thead>
            <tr>
                <th>Tên hàng</th>
                <th>Số lượng</th>
                <th>Đơn giá</th>
                <th colspan="2" style="width:70px">Thành tiền</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var line in Model.Cart.Lines)
            {
                <tr>

                    <td>@line.Product.Name
                    </td>
                    <td>@Html.DropDownList("Quantity", new SelectList(ViewBag.Items as System.Collections.IList, "Value", "Text", line.Quantity), new { data = line.Product.ProductID, @class = "quantity" })</td>
                    <td style="color:#3A9504;margin-left:3px">@string.Format("{0:00,0 VNĐ}", line.Product.Price)</td>
                    <td>@string.Format("{0:00,0 VNĐ}", (line.Quantity * line.Product.Price))</td>
                    <td align="center" style="width:10px"><a href="@Url.Action("RemoveFromCart","Cart",new{ProID= line.Product.ProductID, returnUrl= Request.Url.PathAndQuery})"><img src="@Url.Content("~/Content/Images/delete.png")" style="padding-right:10px" /></a></td>
                </tr>
            }

        </tbody>
        <tfoot>
            <tr style="border-top-style:solid;border-top-color:#DFDFDF;border-top-width:1px;">
                <td colspan="3" align="right" style="border-right-color:#808080;border-right-style:solid;border-right-width:1px;text-align:right"><b>Tổng tiền:</b></td>
                <td style="text-align: center"><b>@string.Format("{0:00,0 VNĐ}", Model.Cart.ComputeTotalValue())</b></td>
                <td></td>
            </tr>
        </tfoot>
    </table>

1 个答案:

答案 0 :(得分:0)

如果我理解正确,那么您的问题是在更新下拉列表中的数据后会丢失该下拉列表中的选项吗?

如果是这样,那么您需要将其添加到JavaScript中的success处理程序:

success: function (data) {
    $("#cartbox").html(data);
    $("#cartbox").find(".quantity").val(Quantity);
}