Como configurar a validação discreta do MVC 5 corretamente ao anexar o formulário de uma chamada AJAX?
Eu pesquisei sobre esse problema no Google e verifiquei meu web.config, bundleconfig e meu layout com a seguinte aparência: web.config:
<appSettings>
<add key="webpages:Version" value="3.0.0.0" />
<add key="webpages:Enabled" value="false" />
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
Na minha pasta App_Start em "BundleConfig.cs":
var jqueryBundle = new ScriptBundle("~/bundles/jquery");
jqueryBundle.Include("~/Scripts/jquery-{version}.js");
jqueryBundle.Include("~/Scripts/moment.min.js");
jqueryBundle.Include("~/Scripts/loadingoverlay.js");
jqueryBundle.Include("~/Scripts/fullcalendar.js");
jqueryBundle.Include("~/Scripts/lang-all.js");
jqueryBundle.Transforms.Add(jsTransformer);
jqueryBundle.Orderer = nullOrderer;
bundles.Add(jqueryBundle);
var jqueryvalBundle = new ScriptBundle ("~ / bundles / jqueryval"); jqueryvalBundle.Include ("~ / Scripts / jquery.validate *"); jqueryvalBundle.Include ("~ / Scripts / jquery.validate.js"); jqueryvalBundle.Include ("~ / Scripts / jquery.validate.unobtrusive.js"); jqueryvalBundle.Transforms.Add (jsTransformer); jqueryvalBundle.Orderer = nullOrderer; bundles.Add (jqueryvalBundle);
na minha página de layout:
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap")
Firebug mostra:
Até agora, tudo está incluído e deve estar funcionando sem problemas.
Meu modelo:
[DisplayName("Förnamn")]
[Required(ErrorMessage = "Vänligen ange ett förnamn")]
[StringLength(100)]
public string FirstName { get; set; }
[DisplayName("Efternamn")]
[Required(ErrorMessage = "Vänligen ange ett efternamn")]
[StringLength(100)]
public string LastName { get; set; }
[DisplayName("E-post")]
[Required(ErrorMessage = "Vänligen ange epost")]
[StringLength(100)]
[EmailAddress(ErrorMessage = "Ange en korrekt e-postaddress")]
public string Email { get; set; }
[DisplayName("Mobil")]
[DataType(DataType.PhoneNumber)]
public string PhoenNumber { get; set; }
[DataType(DataType.Password)]
[DisplayName("Lösenord")]
public string PassWord { get; set; }
Minha visão:
<div class="col-md-4 col-xs-12">
@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "credentialsForm" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group createCustomerFormGroup">
@Html.LabelFor(model => model.FirstName, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { @class = "form-control", @name = "FirstName" } })
@Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group createCustomerFormGroup">
@Html.LabelFor(model => model.LastName, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.EditorFor(model => model.LastName, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group createCustomerFormGroup">
@Html.LabelFor(model => model.Email, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group createCustomerFormGroup">
@Html.LabelFor(model => model.PassWord, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.EditorFor(model => model.PassWord, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PassWord, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group createCustomerFormGroup">
@Html.LabelFor(model => model.PhoenNumber, htmlAttributes: new { @class = "control-label col-md-3" })
<div class="col-md-9">
@Html.EditorFor(model => model.PhoenNumber, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.PhoenNumber, "", new { @class = "text-danger" })
</div>
</div>
</div>
}
</div>
um campo no formulário via firebug:
Eu executo esse script no firebug e não recebo erros, mesmo que deva haver erros, pois alguns dos campos são solicitados, mas eles não têm um valor:
$("#credentialsForm").validate().numberOfInvalids()
// retunrs 0
$("#credentialsForm").validate().valid()
// returns true
Eu estive nisso por horas e estou ficando louco agora, o que estou perdendo?
EDIT: mudou a pergunta de "Como configurar a validação discreta do MVC 5 corretamente" para o título atual, pois descreveu o que eu estava procurando melhor que o título anterior.