Ich muss custom validation
in AJAX
popup
in MVC
durchführen. Ich habe eine CustomValidator
erstellt und überschreibe die IsValid()
Methode. Problem ist, dass das Popup die benutzerdefinierten Validierungen nicht richtig darstellt.Benutzerdefinierte Validierung in AJAX-Popup in mVC
Mein Code:
_Layout.cshtml
<!DOCTYPE html>
<html>
<head>
@Styles.Render("~/Content/css")
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css" />
@Scripts.Render("~/bundles/jquery")
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.ajax.unobtrusive/3.2.4/jquery.unobtrusive-ajax.min.js"></script>
@Scripts.Render("~/bundles/modernizr")
<script>
$(function() {
$("#modalDialog").dialog({
autoOpen:false,
width: 600,
height: 300,
modal: true
});
$("#opener").click(function() {
$("#modalDialog").dialog("open");
});
});
function OnSuccess(response)
{
$("#modalDialog").text(response);
}
</script>
</head>
Index.cshtml:
@model MvcPopup.Controllers.HomeController.SomeModel
@{ViewBag.Title = "Home Page";}
<p>This is page content !!!</p>
<button id="opener">Open Dialog</button>
<div id="modalDialog" title="Basic Modal Dialog">
<p>This is a basic modal dialog</p>
@using (Ajax.BeginForm("Index", new AjaxOptions { UpdateTargetId = "ID", OnSuccess = "OnSuccess" }))
{
<div>
<fieldset>
<legend>Info</legend>
@Html.LabelFor(m => m.EmailAddress)
@Html.TextBoxFor(m => m.EmailAddress)
@Html.ValidationMessageFor(m => m.EmailAddress)
<input type="submit" value="Submit" />
</fieldset>
</div>
}
</div>
HomeController.cs:
public class HomeController : Controller
{
public class SomeModel
{
[CustomValidator]
[Display(Name = "Email address")]
public string EmailAddress { get; set; }
}
public ActionResult Index()
{
var model = new SomeModel();
return View();
}
[HttpPost]
public ActionResult Index(SomeModel model)
{
if (ModelState.IsValid)
{
return PartialView();
}
return PartialView();
}
CustomValidator.cs:
public class CustomValidator : ValidationAttribute
{
protected override ValidationResult IsValid(object value, ValidationContext validationContext)
{
if (value != null)
{
if (value.ToString().Contains("X"))
{
return ValidationResult.Success; ;
}
else
{
return new ValidationResult("Enter an email address with letter X");
}
}
else
{
return new ValidationResult("" + validationContext.DisplayName + " is mandatory.Please enter it.");
}
}
}
Ich kann sehen, dass die Custom Validations
gefeuert werden, aber das Rendern auf der Popup-Seite ist ein bisschen krumm. Erscheint unten wie:
Nun, ich gebe keinen Wert in der E-Mail textbox
, und klicken Sie auf Submit
, kann ich meine benutzerdefinierten Validierung „Email Address is mandatory. Please enter it.
“ wird ausgelöst, und ist offensichtlich auf der Popup-Seite wie folgt:
ich meine, es ist ziemlich offensichtlich, dass die benutzerdefinierte Validierung in der Nähe der E-Mail textbox
und Dinge sollten wie ein popup
aussehen erscheinen soll. Bitte helfen Sie.
EDIT
Validations
erscheinen in der popup
Seite, aber der Inhalt ist etwas schief. I mean the content of the parent page too appear on the popup page
. Schnappschuss unten. Wie man es los wird? Bitte helfen Sie.
'$ ("# ModalDialog") html (Antwort);' (nicht ', Text()') –
Warum nicht einfach einen 'RegularExpressionAttribute' verwenden, um ein' "X", um sicherzustellen, 'enthalten - es ist kein wirklicher Punkt in diesem Attribut –
@StephenMuecke: Diese X-Aufnahme dient nur zu Demonstrationszwecken.Ich kann andere gültige Arten der benutzerdefinierten Validierung haben. – Anurag