I'm having difficulty getting client side validation to work in a modal popup which is in a partial view. I call it in main
.cshtml
<div>
@Html.ActionLink("Add", "_MyPartial", "MyController", new { clientID = "0" }, new {@id = "btnAdd", })
</div>
@using(Html.BeginForm("_MyPartial", "MyController", FormMethod.Post, new { id = "frmClient" }))
{
<div class="modal-content panel panel-info">
<div class="modal-header panel-heading">
<button type = "button" class="close" data-dismiss="modal">×</button>
</div>
<div class="panel-body bootstrap-padding-overide">
@Html.ValidationSummary(false, null, new { @id = "ValidationSummary", @class = "validationErrorBox" })
</div>
<div class="modal-body panel-body bootstrap-padding-overide">
<div>
@Html.LabelFor(m => m.selectName)
@Html.TextBoxFor(m => m.selectName, new { @class = "form-control" })
</div>
<div>
<input type = "submit" name="submitButton" value="Submit" class="btn btn-default" />
</div>
</div>
</div>
}
@section MyScripts
{
<script type="text/javascript">
$.validator.unobtrusive.parse("#frmClient form");
</script>
}
[Required(ErrorMessage = "Please Insert a Name")]
[Display(Name = "Persons Name")]
public string selectName { get; set; }
html.BeginForm
jQuery document.ready
@using (Html.BeginForm("_MyPartial", "MyControlloer", FormMethod.Post, new { id = "frmClient" }))
{
<script type="text/javascript">
$('form#frmClient').removeData("validator");
$('form#frmClient').removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse($('form#frmClient'));
</script>
}
Since partial view loads so you have to re-add the form validation like mentioned below
$("form").removeData("validator");
$("form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse($('form'));
Add these lines in your partial view loaded handler or handler of action link.