Hi,
Maybe I just do not understand or I made some mistakes but:
When using the validator in combination with a plain MVC form, the page always posts to the server. That kinda surprised me. I assumed with the correct annotations on the model, the client side validation should occur first and the page should never do a postback when the form is invalid.
I solved that by setting the required attribute on each html input element.
It seems a little strange I have to add on both the model and in the view a required flag. Or am I missing something?
Here is my example: (attached is my project)
Maybe I just do not understand or I made some mistakes but:
When using the validator in combination with a plain MVC form, the page always posts to the server. That kinda surprised me. I assumed with the correct annotations on the model, the client side validation should occur first and the page should never do a postback when the form is invalid.
I solved that by setting the required attribute on each html input element.
It seems a little strange I have to add on both the model and in the view a required flag. Or am I missing something?
Here is my example: (attached is my project)
@model Gusto.Web.ViewModels.LoginViewModel
@{
ViewBag.Title = @Resources.Resource.Login_Page_Title;
}
<
div
class
=
"form-vertical login"
>
<!-- BEGIN LOGO -->
<
div
class
=
"logo"
>
<
h1
>Bluefox</
h1
>
</
div
>
@using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl }))
{
<
div
id
=
"login-form"
>
@Html.AntiForgeryToken()
@Html.ValidationSummary(true)
<
div
class
=
"status"
></
div
>
<
fieldset
>
<
legend
>@Resources.Resource.Login_Page_Title</
legend
>
<
div
class
=
"control-group"
>
@Html.LabelFor(m => m.Model.UserName, new { @class="control-label"})
<
div
class
=
"controls"
>
@Html.EditorFor(m => m.Model.UserName, new { @required="required" })
@Html.ValidationMessageFor(m => m.Model.UserName)
</
div
>
</
div
>
<
div
class
=
"control-group"
>
@Html.LabelFor(m => m.Model.Password)
@Html.PasswordFor(m => m.Model.Password, new { @required="required" })
@Html.ValidationMessageFor(m => m.Model.Password)
</
div
>
<
div
class
=
"control-group"
>
@Html.CheckBoxFor(m => m.Model.RememberMe)
@Html.LabelFor(m => m.Model.RememberMe, new { @class = "checkbox" })
</
div
>
<
input
type
=
"submit"
class
=
"btn green pull-right"
value
=
"Login"
id
=
"btnSubmit"
/>
</
fieldset
>
</
div
>
}
<
p
>
@Html.ActionLink("Register", "Register") @Resources.Resource.Login_Register
</
p
>
</
div
>
@section Scripts {
<
script
type
=
"text/javascript"
>
$(document).ready(function () {
var validator = $("#login-form").kendoValidator().data("kendoValidator"), status = $(".status");
$("#btnSubmit").click(function () {
if (validator.validate()) {
save();
} else {
status.text("@Resources.Resource.Generic_Error_Form")
.removeClass("valid")
.addClass("invalid");
}
});
});
</
script
>
}