The objective was to add new entries in the collection via PartialView. In the first entry, checking via debugging it was working fine. But if i add another entry, it doesn't retain or the last entries is not included in the collection.
What seems to be the problem that my entries are not save/collected in the collection?
Model :
public class MasterInfo {
public int id { get; set; }
public string name { get; set; }
}
public class DetailInfo
{
public int id { get; set; }
public string data_name { get; set; }
public int data_val { get; set; }
}
public class MasterDtlViewModel
{
public MasterDtlViewModel() {
this.Details = new List();
}
public MasterInfo Master { get; set; }
public List Details { get; set; }
}
Controller
public ActionResult NewMaster()
{
var model = new MasterDtlViewModel();
model.Master = new MasterInfo { id = 1, name = "Chris" };
model.Details.Add(new DetailInfo
{
data_name = "Fee",
data_val = 1000
});
model.Details.Add(new DetailInfo
{
data_name = "Charge",
data_val = 500
});
return View("CreateMasterDtlView", model);
}
//POST
public ActionResult NewMaster(MasterDtlViewModel model)
{
var testDetailEntry = model.Details;
return View("", model);
}
//POST
public ActionResult AddNewEntry(MasterDtlViewModel model, DetailInfo newEntry)
{
model.Details.Add(newEntry);
return PartialView("_tableDetailView", model);
}
View :
@model Permit.MasterDtlViewModel
@{
}
@using (Html.BeginForm())
{
Master
@Html.LabelFor(m => m.Master.id, "Customer Id", new { @class = "control-label col-md-4" })
@Html.TextBoxFor(m => m.Master.id, null, new { @class = "form-control" })
@Html.LabelFor(m => m.Master.name, "Customer Name", new { @class = "control-label col-md-4" })
@Html.TextBoxFor(m => m.Master.name, null, new { @class = "form-control" })
Detail Info
@Html.Label("DataName", "Data Name", new { @class = "control-label col-md-4" })
@Html.TextBox("DataName", null, new { @class = "form-control" })
@Html.Label("DataValue", "Data Value", new { @class = "control-label col-md-4" })
@Html.TextBox("DataValue", null, new { @class = "form-control" })
Added Details
@Html.Partial("_tableDetailView", Model)
}
@section scripts {
}
PartialView
@model Permit.MasterDtlViewModel
Idx
Data Name
Value
@if (Model.Details != null)
{
for (int i = 0; i < Model.Details.Count; i++)
{
@Model.Details[i].id
@Model.Details[i].data_name
@Model.Details[i].data_val
}
}
(Note: Having difficulty attaching the codes)
Sirch SarsoPosted Jun 5, 2024, 2:02 PM
Sir Navamany.
I tried your suggestion but i received an error "Uncaught SyntaxError: Unexpected token 'S', "System.Col"... is not valid JSON".
I console the actual value of hiddenfield details and it is System.Collections.Generic.List`1[Permit.DetailInfo] and not referring to the actual list values.
Mayooran NavamanyPosted Jun 3, 2024, 1:26 PM
The issue you're encountering with not retaining entries in the collection when adding new entries via PartialView in an MVC application often stems from the way the model state is managed during the AJAX requests. When you update the view with a PartialView, the model state is not preserved between requests, causing the entries to be lost.
Here's a more detailed solution to ensure that the entries are retained:
Store the Current State in a Hidden Field: Store the current state of the
Detailslist in a hidden field so it can be included in the model during subsequent requests.Update the JavaScript to Handle the Hidden Field: Modify the JavaScript to read and update this hidden field.
Update the Controller to Use the Updated List: Ensure the controller merges the new entries with the existing entries.
Here's how you can implement these changes:
Step 1: Update the View
Add a hidden field to store the current state of the
Detailslist:Step 2: Update the Controller
In the
AddNewEntryaction, merge the new entry with the existing entries from the hidden field:Step 3: Ensure Partial View is Correct
Make sure the partial view correctly displays the details:
Explanation
AddButtonclick event handler reads the current state from the hidden field, appends the new entry, and updates the hidden field before making the AJAX request.This approach ensures that each new entry is added to the collection, and the updated list is displayed correctly in the view.