【问题标题】:Dropdown list in WebgridWebgrid 中的下拉列表
【发布时间】:2012-10-24 20:50:20
【问题描述】:

谁能帮助我如何在我的 webgrid 列中放置一个下拉列表。

我需要将我的下拉列表绑定到模型中的列表。并且需要从列表中为网格中的每个对应记录选择一个项目。

而且我应该能够将 selcetd 值发布到控制器。

我已经在几个链接Dropdownlist propbelm in mvc3 和其他几个链接中尝试了解决方案。

我正在粘贴我的示例代码。

型号:

public class AllocateToStore
    {
        public IList<OrderLine> FailureAllocations { get; set; }
        public IList<SelectListItem> AllocationStatus
        {
            get
            {
                // code to fetch list.
            }
        }
    }

 public class OrderLine
    {
        public long Id { get; set; }
        public DateTime Date { get; set; }
        public int Status { get; set; }
    }

控制器:

public ActionResult AutoAllocate()
        {
// This action will load the view with data.
// Get model data and send it to view.

            return View("Allocated",model);
        }

        [HttpPost]
        public ActionResult ResolveUnallocatedOrders(AllocateToStore coll)
        {
// When user changes the selection in grid and post the page I need to get the selection // here. So that I can update that record.
            return null;
        }

视图是

@model AllocateToStore
@{
    ViewBag.Title = "Orders";
}
@{
    var grid = new WebGrid(Model.FailureAllocations, rowsPerPage: 100);
}

@using (Html.BeginForm("ResolveUnallocatedOrders", "OrderProcessing", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    if (Model.FailureAllocations.Any())
    {

    <div>
        @grid.GetHtml(
                columns: grid.Columns(
                    grid.Column(columnName: "Order date", header: "Order Date", format: item => item.Order.Date),
                    grid.Column("dropdown", header: "Resolution", format:
                                                            @<span>
                                                                @{ var index = Guid.NewGuid().ToString(); }
                                                                @Html.Hidden("Status.Index", index)
                                                                @Html.DropDownList("Status[" + index + "].SelectedValue", Model.AllocationStatus)
                                                            </span>
                    )
                ),
                tableStyle: "expandable-table",
                htmlAttributes: new { id = "gridFailureAllocations" }
            )
        <br />
        <input type="submit" value="Resolve" id="resolve-button" />
    </div>
    }

}

谢谢, 纳雷什

【问题讨论】:

    标签: asp.net-mvc-3 asp.net-mvc-4 webgrid html.dropdownlistfor html-select


    【解决方案1】:

    以下应该有效:

    <div>
        @grid.GetHtml(
                columns: grid.Columns(
                    grid.Column(columnName: "Date", header: "Order Date"),
                    grid.Column("dropdown", header: "Resolution", format:
                        @<span>
                            @{ var index = Guid.NewGuid().ToString(); }
                            @Html.Hidden("FailureAllocations.Index", index)
                            @Html.Hidden("FailureAllocations[" + index + "].Id", (long)item.Id)
                            @Html.DropDownList("FailureAllocations[" + index + "].Status", Model.AllocationStatus)
                        </span>
                    )
                ),
                tableStyle: "expandable-table",
                htmlAttributes: new { id = "gridFailureAllocations" }
            )
        <br />
        <input type="submit" value="Resolve" id="resolve-button" />
    </div>
    

    然后在您的 ResolveUnallocatedOrders 控制器操作中,您可以使用 coll.FailureAllocations 检索相应的值:

    [HttpPost]
    public ActionResult ResolveUnallocatedOrders(AllocateToStore coll)
    {
        // coll.FailureAllocations will contain the necessary data
        ...
    }
    

    备注:如果您想在 POST 操作中取回其值,可以为 Order.Date 字段添加一个额外的隐藏字段。

    【讨论】:

    • 感谢您的回复达林。但是我没有使用页面加载时的值选择下拉列表。我怎样才能做到这一点?谢谢。
    • 我已经解决了这样的问题 @Html.DropDownList("FailureAllocations[" + index + "].Status", new SelectList(Model.AllocationStatus,"Value","Text", item.地位))。如果我错了,请纠正我。谢谢。
    猜你喜欢
    • 1970-01-01
    • 2012-09-18
    • 1970-01-01
    • 2017-01-03
    • 2020-05-03
    • 2015-08-31
    • 1970-01-01
    • 2021-12-17
    • 2012-09-30
    相关资源
    最近更新 更多