0

I'm trying to add/delete EnquiryLineItems into Quotation View. Tried to follow

But while clicking on Add it throws error

Failed to load resource: the server responded with a status of 500 (Internal Server Error)

and probably constructing wrong URl ( http://localhost:53363/Enquiries/CreateLineItem?_=1505728151541 - as per the error message )

Using Partialview and Single Controller .

ViewModels :

 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; }
    }

Controller:

 // 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());
        }

MainView ( Enquiry- create) - only added relevant code

@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>
}

partialViews - _createEnquiryItem.cshtml

@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>

What might be I'm doing wrong here. Also, whether this can be done with a better or easier approach using single partial view? Please help. Thanks in advance.

user2695433
  • 2,013
  • 4
  • 25
  • 44
  • 1
    All you need is a single partial view for `EnquiryLineItemVM`. But y9ou have multiple issues with your code. First you have nested forms which is invalid html and not supported. Your collection property is named `LineItems` so it needs to be `@using (Html.BeginCollectionItem("LineItems"))` (they need to match). Then you calling a method named `CreateLineItem` which by default returns a partial view named `CreateLineItem.cshtml`, but your question onl;y has one named `_CreateLineItem.cshtml`. It needs to be `return PartialView("_CreateLineItem", new EnquiryLineItemVM());` –  Sep 18 '17 at 11:22
  • 1
    Then there are other issues that make no sense such as multiple `@Html.ValidationSummary()` - there should one in the main view, and none in the partial, and your submit buttons in the partial. And its not clear what your last view (`_EnquiryItems.cshtml`) is for an how its related to your question –  Sep 18 '17 at 11:27
  • @StephenMuecke thanks for pointing out these. The 2 partial views were used for adding and Viewing . Followed the links not sure whether it was needed , not used though currently – user2695433 Sep 18 '17 at 12:55
  • Refer also [this answer](https://stackoverflow.com/questions/40539321/a-partial-view-passing-a-collection-using-the-html-begincollectionitem-helper/40541892#40541892) - as much as anything to show how your scripts should look like –  Sep 18 '17 at 13:02
  • @StephenMuecke sorry public PartialViewResult CreateLineItem() { var lineItemVM = new EnquiryLineItemVM(); return PartialView("_CreateEnquiryItem", lineItemVM); } to return partial View but still the same issue persists – user2695433 Sep 18 '17 at 13:04
  • @StephenMuecke thanks alot . I will go through the link shared. – user2695433 Sep 18 '17 at 13:05
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/154689/discussion-between-stephen-muecke-and-user2695433). –  Sep 18 '17 at 13:05

0 Answers0