Hi Team,
In my web application, I have added an Add new button and when the user clicks the button a new partial view will load to the main view.
If the user clicks the button again, another partial view is loaded.
The Issue is if the user removed the partial view that was added by the second click, It is removed from the view, but when it submits controller.
ModelState.IsValid
becomes false and return the view again, then the deleted partial view is there again.
Remove button I have added within the partial view, So I think when I clicked to the remove button is removed from the view but It won't be removed from the main view.
Can help me to solve this error?
This is how I call the partial view within the main view.
<fieldset id="pnlGeneralItms" style="display:@(Model.GeneralItmsList == null || Model.GeneralItmsList.Count == 0? " none":"")">
<legend>
<h5>General Request Attachments / Bills</h5>
</legend>
<ul id="RequItms" style="list-style-type: none"> @if (Model != null && Model.GeneralItmsList != null) { foreach (Asp_PASMVC.Models.GeneralItms Itms in Model.GeneralItmsList) { Html.RenderPartial("_GeneralItms", Itms); } } </ul>
<button type="button" id="addAnotherItm" class="btn btn-info" href="#">Add New Record</button>
<script type="text/javascript">
$(function() {
$("#addAnotherItm").click(function() {
$.get('/AppRequests/GeneralItmsPartialView', function(template) {
$("#RequItms").append(template);
});
});
});
</script>
</fieldset>
This is the controller code where pass the partial view
public ActionResult GeneralItmsPartialView()
{
GeneralItms obj = new GeneralItms();
obj.TempID = Counter++;
return PartialView("_GeneralItms", obj);
}
This is the Partial view
<li style="padding-bottom:15px">
@using (Html.BeginCollectionItem("GeneralItmsList")) { @Html.HiddenFor(model => model.TempID) @Html.ValidationSummary(true, "", new { @class = "text-danger" }) <div class="row">
<div class="col-md-5 col-sm-6">
<div class="form-group"> Type Line Description <div class="col-md-10"> @Html.EditorFor(model => model.Attachment_Description, new { htmlAttributes = new { @class = "form-control", placeholder = "Make it short" } }) @Html.ValidationMessageFor(model => model.Attachment_Description, "", new { @class = "text-danger" }) </div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="form-group"> Attachment Amount <div class="col-md-10">
<div class="input-group-prepend">
<span class="input-group-text">Rs.</span> @Html.EditorFor(model => model.Attachment_Amount, new { htmlAttributes = new { @class = "form-control" } })
</div> @Html.ValidationMessageFor(model => model.Attachment_Amount, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="form-group"> Attachment <div class="col-md-10">
<input type="file" name="ImageData@(Model.TempID.ToString())" id="ImageData@(Model.TempID.ToString())" multiple="multiple" data-id="Img@(Model.TempID.ToString())" onchange="checkImage(this)" /> @Html.ValidationMessageFor(model => model.Attachment, "", new { @class = "text-danger" })
</div>
</div>
<img id="Img@(Model.TempID.ToString())" src="" alt="" width="100" height="100" class="ml-1" />
</div>
<button type="button" class="btn btn-danger" onclick="$(this).parent().Remove();">Remove</button>
</div> }
</li>
