使用BeginCollectionItem在MVC5 partialview中添加/删除Lineitems

时间:2017-09-18 10:32:08

标签: razor asp.net-mvc-5 asp.net-mvc-partialview begincollectionitem

我正在尝试将EnquiryLineItems添加/删除到报价视图中。 试图按照

但点击Add it会抛出错误

  

无法加载资源:服务器响应状态为500(内部服务器错误)

并且可能构造错误的URl( public class EnquiryVM { public int ID { get; set; } public DateTime? PreparedDate { get; set; } [StringLength(12)] public string EnquiryNumber { get; set; } public DateTime? ClosingDate { get; set; } public int ClientID { get; set; } public IEnumerable<SelectListItem> Clients { get; set; }//DDL in main view public Client Client { get; set; } public DateTime? RFQSentDate { get; set; } public int ItemID { get; set; } public List<EnquiryLineItem> LineItems { get; set; }// this is added/deleted dynamically } public class EnquiryLineItemVM { public int ID { get; set; } public string ItemDesc { get; set; } public int Quantity { get; set; } public int ManufacturerId { get; set; } public SelectList ManufacturerList { get; set; } } - 根据错误消息)

使用部分视图和单个控制器。

ViewModels:

 // GET: Enquiries/Create
        public ActionResult Create()
        {
            var viewModel = GetAllCategories();
            return View(viewModel);
        }
  //Create View Population method - for dropdownlists
        private EnquiryVM GetAllCategories()
        {
            var model = new EnquiryVM();
            var clients = db.Clients.ToList();
            model.Clients = clients.Select(s => new SelectListItem
            {
                Value = s.ID.ToString(),
                Text = s.Name
            });

           var LineItems = new List<EnquiryLineItem>();//added to avoid null exception, 
            model.LineItems = LineItems;

           return model;
        }
//to render partialView
 public PartialViewResult CreateLineItem()
        {
            return PartialView(new EnquiryLineItemVM());
        }

控制器:

@model EnquiryVM

@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">

        @Html.ValidationSummary(true, "", new { @class = "text-danger" })

        <div class="form-group">
            @Html.LabelFor(model => model.EnquiryNumber, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-3">
                @Html.EditorFor(model => model.EnquiryNumber, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.EnquiryNumber, "", new { @class = "text-danger" })
            </div>
        </div>

         <div class="form-group">
            @Html.LabelFor(model => model.ClientID, "Client", htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-3">

                @Html.DropDownListFor(u => u.ClientID, (IEnumerable<SelectListItem>)Model.Clients, "--Select--")
                @Html.ValidationMessageFor(model => model.ClientID, "", new { @class = "text-danger" })
            </div>
        </div>


        </div>

        <div id="LineItems">
            @using (Html.BeginForm())
            {
                <div id="editorRowsLineitems">
                    @foreach (var item in Model.LineItems)
                    {
                        @Html.Partial("_CreateEnquiryItem", item)
                    }
                </div>
                @Html.ActionLink("Add Items", "CreateLineItem", null, new { id = "addItem", @class = "button" });
            }
        </div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
    $(function () {
        $('#addItem').on('click', function () {
            $.ajax({
                url: '@Url.Action("CreateLineItem")',
                    cache: false,
                    success: function (html) { $("#editorRowsLineitems").append(html); }
                });
                return false;
            });
        $('#editorRowsLineitems').on('click', '.deleteRow', function () {
                $(this).closest('.editorRow').remove();
            });

        });
</script>
}

MainView(Enquiry-创建) - 仅添加相关代码

@model .EnquiryLineItemVM

<div class="editorRow">
    @using (Html.BeginCollectionItem("ItemList"))
    {
        <table class="table">

            @Html.ValidationSummary(true, "", new { @class = "text-danger" })

            <tr>
                <td>
                    @Html.EditorFor(model => model.ItemDesc)
                    @Html.ValidationMessageFor(model => model.EnquiryLineItem.ItemDesc, "", new { @class = "text-danger" })
                </td>
                <td>
                    @Html.EditorFor(model => model.Quantity)
                    @Html.ValidationMessageFor(model => model.EnquiryLineItem.Quantity)
                </td>

                <td>
                    @Html.DropDownListFor(model => model.ManufacturerId, Model.ManufacturerList, "--Please Select--")
                    @Html.ValidationMessageFor(model => model.ManufacturerId, "", new { @class = "text-danger" })
                </td>
            </tr>
        </table>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>

    }
    </div>

partialViews - _createEnquiryItem.cshtml

{{1}}

我可能在这里做错了什么。此外,使用单个局部视图是否可以使用更好或更简单的方法来完成此操作?  请帮忙。提前谢谢。

0 个答案:

没有答案