Kendo MVC validator always gives postback?

[Marco]

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: 

public class LoginViewModel : BaseViewModel
    {
        public LoginModel Model { get; set; }
    }

public class LoginModel
    {
        [Required(ErrorMessageResourceName="Generic_Error_IsRequired", ErrorMessageResourceType=typeof(App_GlobalResources.Resource))]
        [Display(Name="Login_Username", ResourceType=typeof(App_GlobalResources.Resource))]
        public string UserName { get; set; }

        [Required(ErrorMessageResourceName = "Generic_Error_IsRequired", ErrorMessageResourceType = typeof(App_GlobalResources.Resource))]
        [DataType(DataType.Password)]
        [Display(Name = "Login_Password", ResourceType = typeof(App_GlobalResources.Resource))]
        public string Password { get; set; }

        [Display(Name = "Login_Remember_me", ResourceType = typeof(App_GlobalResources.Resource))]
        public bool RememberMe { get; set; }
    }

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

[Sebastian]

Hello Marco,

It looks you found the cause of the abnormality and the solution for it here. I am closing this thread to avoid forks in the communication which appears to be on the same subject.

Regards,
Sebastian
Telerik