在另一个部分视图问题中插入局部视图(Collection.cshtml ISSUE)

时间:2017-12-24 16:04:30

标签: c# asp.net-mvc partial-views

我的PROPERTY VM包含List<FounderInvestmentViewModel>。我已成功将FounderInvestmentViewModel的部分视图插入主创建属性视图。

FounderInvestmentViewModel又包含List<InstallmentDetailsViewModel>。我已将InstallmentDetailsViewModel的部分视图创建为_InstallmentDetails.cshtml以及所有必要的操作。

我想将_InstallmentDetails.cshtml插入FounderInvestmentViewModel的局部视图中,然后将其插入主视图。

首先让我们看一下目前使用的代码: -

属性视图模型: -

public class PropertyViewModel
    {

        public int? Id { get; set; }
        public string PropertyTitle { get; set; }
        ....other attributes....
        public List<FounderInvestmentViewModel> FounderInvestments { get; set; } = new List<FounderInvestmentViewModel>();
    }

FounderInvestmentViewModel: -

public class FounderInvestmentViewModel
    {
        public int? Id { get; set; }        
        public int InvestorId { get; set; }
        public double Investment { get; set; }
        public int InstallmentPeriod { get; set; }
        public IEnumerable<SelectListItem> FounderInvestorList { get; set; }
        public List<InstallmentDetailsViewModel> InstallmentDetails { get; set; } = new List<InstallmentDetailsViewModel>();

    }

InstallmentDetailsViewModel: -

public class InstallmentDetailsViewModel
    {
        public int? Id { get; set; }

        [Display(Name = "Pay Date")]
        public List<DateTime> PayDates { get; set; }
        [Required]
        public List<double> InstallmentAmounts { get; set; }
    }

PartmentView for InstallmentDetails(_InstallmentDetails.cshtml): -

@model propertyMgmt.ViewModel.InstallmentDetailsViewModel

<div class="installmentDetails">
    @using (Html.BeginCollectionItem("InstallmentDetails"))
    {
        @Html.HiddenFor(m => m.Id, new { @class = "id" })

        <div class="form-group">
            @Html.LabelFor(m => m.InstallmentAmounts, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(m => m.InstallmentAmounts, new { htmlAttributes = new { @class = "form-control", @type = "number" } })
                @Html.ValidationMessageFor(m => m.InstallmentAmounts, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(m => m.PayDates, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(m => m.PayDates, new { htmlAttributes = new { @class = "form-control", @placeholder = "01/02/2017" } })
                @Html.ValidationMessageFor(m => m.PayDates, "", new { @class = "text-danger" })
            </div>
        </div>
    }
</div>

这个_InstallmentDetails.cshtml被插入到这个_FounderInvestmentDetails.cshtml中,这是PartialView for FounderInvestmentDetails View Model: -

@model propertyMgmt.ViewModel.FounderInvestmentViewModel

<div class="founderInvestmentDetails">
    @using (Html.BeginCollectionItem("FounderInvestments"))
    {      
            @Html.HiddenFor(m => m.Id, new { @class = "id" })

            <div class="form-group">
                @Html.LabelFor(m => m.InvestorId, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.DropDownListFor(m => m.InvestorId, Model.FounderInvestorList, "Select Investor", htmlAttributes: new { @class = "form-control" })
                    @Html.ValidationMessageFor(m => m.InvestorId, "", new { @class = "text-danger" })                    
                </div>
            </div>

            <div class="form-group">
                @Html.LabelFor(m => m.Investment, htmlAttributes: new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(m => m.Investment, new { htmlAttributes = new { @class = "form-control", @type = "number" } })
                    @Html.ValidationMessageFor(m => m.Investment, "", new { @class = "text-danger" })

                </div>
            </div>
            <div class="form-group">
                @Html.LabelFor(m => m.InstallmentPeriod, htmlAttributes: new { @class = "control-label col-md-2", @type = "number" })
                <div class="col-md-10">
                    @Html.EditorFor(m => m.InstallmentPeriod, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(m => m.InstallmentPeriod, "", new { @class = "text-danger" })

                </div>
            </div>
            <div class="form-group" id="installmentDetailsDiv">
                @foreach (var InstallmentDetails in Model.InstallmentDetails) 
                {
                    @Html.Partial("_InstallmentDetails", InstallmentDetails)
                }
            </div>

            <div class="form-group col-md-10">
                <input type="button" class="btn btn-info btn-xs" value="Add Installment Details" onclick="addInstallmentDetails()" /> 
            </div>    
    }
</div>

这是MAIN CREATE VIEW: -

@model propertyMgmt.ViewModel.PropertyViewModel.PropertyViewModel   
@{
    ViewBag.Title = "Create";    
}
<script src="~/Areas/Admin/themes/jquery/jquery.min.js"></script>        
<h2>Property</h2>    
@using (Html.BeginForm("Create", "Property", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Add Property</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.PropertyTitle, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.PropertyTitle, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.PropertyTitle, "", new { @class = "text-danger" })
            </div>
        </div>
        .....Other form Groups.....
        <div id="founderInvestmentDetails">          
            @foreach(var FounderInvestments in Model.FounderInvestments)
            {
            @Html.Partial("_FounderInvestmentDetails", FounderInvestments)
            }
        </div>

        <div class="form-group col-md-10" >
            <input type="button" class="btn btn-info btn-xs" value="Add Founder Investors" onclick="addFounderInvestors()" />
        </div>
    </div>
}

这是主视图中的我的JS代码: -

function addFounderInvestors() {
        var url = '@Url.Action("FounderInvestmentDetails")';
        var form = $('form');
        var founders = $('#founderInvestmentDetails');
        $.get(url, function (response) {
            founders.append(response);
            // Reparse the validator for client side validation
            form.data('validator', null);
            $.validator.unobtrusive.parse(form);
        });
    };

    function addInstallmentDetails() {
        var url = '@Url.Action("InstallmentDetails")';
        var form = $('form');
        var installments = $('#installmentDetailsDiv');
        $.get(url, function (response) {
            installments.append(response);
            // Reparse the validator for client side validation
            form.data('validator', null);
            $.validator.unobtrusive.parse(form);
        });
    };

控制器代码: -

public PartialViewResult FounderInvestmentDetails()
        {
            var model = new FounderInvestmentViewModel {
                FounderInvestorList = _investorQueryProcessor.GetInvestorByType(1).Select(x => new SelectListItem
                {
                    Value = x.Id.ToString(),
                    Text = x.InvestorName
                })

        };
            //return PartialView(model);
            return PartialView("_FounderInvestmentDetails", model);
        }

        public PartialViewResult InstallmentDetails()
        {
            return PartialView("_InstallmentDetails",new InstallmentDetailsViewModel());
        }
public ActionResult Create()
        {
            if (Session["AdminName"] != null)
            {
                //ViewBag.Investors = SelectListItems;
                List<FounderInvestmentViewModel> model = new List<FounderInvestmentViewModel>();
                List<InstallmentDetailsViewModel> model2 = new List<InstallmentDetailsViewModel>();
                return View(new PropertyViewModel());

            }
            else return Redirect("/Account/Login");
        }

编辑: - 对不起,这就是抛出异常 - &gt;&gt; Collection.cshtml 流程: - 在主视图中,单击事件上的“添加方正投资者按钮”会成功添加部分视图_FounderInvestmentDetails.cshtml。现在将添加“添加分期付款详细信息”按钮。单击此“添加分期付款详细信息”按钮{{ 1}}应该附加局部视图,但这部分不起作用。当我单击此按钮时,我在以下代码中收到错误_InstallmentDetails.cshtml: -

"Object reference not set to an instance of an object"

1 个答案:

答案 0 :(得分:1)

“支付和分期付款”不一定是<List>,因为它已经是PartialView,可以多次添加。

public class InstallmentDetailsViewModel {
    public int? Id { get; set; }    
    [Display(Name = "Pay Date")]
    public List<DateTime> PayDates { get; set; }
    [Required]
    public List<double> InstallmentAmounts { get; set; }
}