how to put validation on partial view in mvc on submit button of partial view ?
It depend on How u r loading partial view?
How r u loading partial view. on ajax call or on ajac actionlink or @html.Partial?
If it is with ajax call, call following function on suucess after result html is assigned to div
function ApplyValidation() { $("form").removeData("validator"); $("form").removeData("unobtrusiveValidation"); $.validator.unobtrusive.parse("form"); }
Also you need to have reference to the scripts in main view
<script src="~/Scripts/jquery-1.10.2.min.js"></script> <script src="~/Scripts/jquery.validate.min.js"></script> <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script> <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
Here I am using partial view and validate its model on submit button.
But I don’t want to load again main view and then partial view ….I want only load partial view. Give error message for that on submit button.
Simply add Remote Method in Your View Model Property. like below and that Particular method in controller
//In ViewModel Of Partial VIew [Remote("IsMemberNameExist", "ControllerName(e.g:Home)",AdditionalFields="Id", ErrorMessage = "Member Name already exists")] public string MemberName { get; set; } public string Address { get; set; } public System.DateTime DOB { get; set; } public string MobileNumber { get; set; } public int Age { get; set; } public int Client { get; set; } public bool Maritial Status { get; set; } . . . //In Controller (e.g:-HomeConrtoller) public JsonResult IsMemberNameExist (string userName) { empLoginRepo = new EmployeeLoginRepository(); userName = Request.QueryString[0].ToString(); var member = empLoginRepo.getUsername(userName); if (member == null) { return Json(true, JsonRequestBehavior.AllowGet); } else { return Json("Username already exist!!!", JsonRequestBehavior.AllowGet); } }
vraju9896
Here I am using partial view and validate its model on submit button.
Yes, that partial view, how r you getting into the main view?
Hi vraju9896,
Thanks for your post.
You should try unobstrusive Client side Validation Example
JQuery
$('#BTN').click(function () { var $formContainer = $('#formContainer'); var url = $formContainer.attr('data-url'); $formContainer.load(url, function () { var $form = $('#myForm'); $.validator.unobtrusive.parse($form); $form.submit(function () { var $form = $(this); if ($form.valid()) { $.ajax({ url: url, async: true, type: 'POST', data: JSON.stringify("Your Object or parameter"), beforeSend: function (xhr, opts) { }, contentType: 'application/json; charset=utf-8', complete: function () { }, success: function (data) { $form.html(data); $form.removeData('validator'); $form.removeData('unobtrusiveValidation'); $.validator.unobtrusive.parse($form); } }); } return false; }); }); return false; });View
<div id="formContainer" data-url="@Url.Action("ActionName", "ControllerName")"></div> <input id="BTN" type="button" value="Button" />Model
public class SampleModule { [Required] public String MyName { get; set; } }Partial View
@using (Html.BeginForm("Action Name", "Controller Name", FormMethod.Post, new { id = "myForm" })) { @Html.LabelFor(i => i.MyName) @Html.TextBoxFor(i => i.MyName) @Html.ValidationMessageFor(i => i.MyName) <p id="getDateTimeString"></p> <input type="button" value="Button" /> }References
<script src="/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script src="/Scripts/jquery.validate.js" type="text/javascript"></script> <script src="/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"> </script>Hope this can be helpful.
Best Regards,
Eileen