单击“保存”按钮时，Jquery对话框部分视图服务器端validation

我有一个显示数据的表。 每行表都有“编辑”按钮。 单击编辑按钮时，将显示一个jquery对话框，其中包含用于编辑用户信息的表单以及保存和取消按钮。 表单只是部分视图按钮是部分视图的一部分。

 $("#editResult").dialog({ title: 'Edit Admin', autoOpen: false, resizable: false, height: 500, width: 600, show: { effect: 'drop', direction: "up" }, modal: true, draggable: true, open: function (event, ui) { $(this).load('@Url.Action("EditAdmin", "AdminSearchResult")', { id: 1 , isEdit : true }); // pass par from function EditCurrentRow(par) in pacle of 1 }, close: function (event, ui) { $(this).dialog('close'); } }); 

点击编辑按钮我得到正确值的对话框。 当没有validation错误（服务器端validation）时，保存按钮工作正常，但一旦出现validation错误，部分页面将在新页面中打开。 取消工作正常。 我的部分观点

 @using (Ajax.BeginForm("EditAdmin", "AdminSearchResult", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "editPanel" })) { 
 // this is where my html control is Save   Cancel 
 } 

我的控制器actionResult是

 [HttpPost] public ActionResult EditAdmin(int id, Administration admin, string button, bool isEdit = false) { if (button == "save") { var errors = admin.Validate(new ValidationContext(admin, null, null)); if (errors.Count() == 0) { return RedirectToAction("AdminSearchResult", "AdminSearchResult"); } else { foreach (var error in errors) foreach (var memberName in error.MemberNames) ModelState.AddModelError(memberName, error.ErrorMessage); return PartialView("EditAdmin", admin); } } if (button == "cancel") { return RedirectToAction("AdminSearchResult", "AdminSearchResult"); } return View(); } 

我认为对话框中的任何按钮单击方法都应该是ajax-ified和json-ized。 所以我试着做以下几点

       $(document).ready(function () { $("#SubmitButton").click(function () { var id = $('#txtID').val(); var lName = $('#txtLastName').val(); var mName = $('#txtMiddleName').val(); var fName = $('#txtFirstName').val(); var uName = $('#txtUserName').val(); var email = $('#txtEmail').val(); var uRole = $('#ddlUserRoleName').val(); var active = $('#chkActive').val(); var admin = { ID: id, LastName: lName, MiddleName: mName, FirstName: fName, userName: uName, emailAddress: email, IsActive: active, UserRole: uRole } $.ajax({ url: '@Url.Action("EditAdmin", "AdminSearchResult")', type: 'POST', dataType: 'html', contentType: "application/json; charset=utf-8", data: 'JSON.stringify(admin)', success: function (result) { alert(result); if (result.success) { alert("Success"); } else { alert("Fail"); $('#editPanel').html(result); } } }); return false; }); }); </script 

问题是在$（“＃SubmitButton”）上添加$ .ajax调用之后。单击（function（）按钮只是在单击时执行任何操作。我希望它在没有发生服务器和客户端validation错误时保存，如果应该在对话框中显示错误消息。

同样在我的网络配置中，我有适当的validation设置

谢谢

Answer 1

您应该尝试不引人注意的客户端validation示例

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

视图

模型

 public class SampleModule { [Required] public String MyName { get; set; } } 

部分视图

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

参考

Answer 2

嗨，不写任何Jscript我们可以内置不显眼的function。 如下。

模型

  Public class Model{[Required(ErrorMessage = "Required.")] [Range(0, int.MaxValue, ErrorMessage = "Please enter a Number")] public int NumberOfPosters { get; set; }} 

部分视图

  @Html.TextBoxFor(model => model.NumberOfPosters, new { style="width:150px;"}) @Html.ValidationMessageFor(model => model.NumberOfPosters)