Events

The Telerik UI Form for ASP.NET MVC exposes a number of JavaScript events that allow you to control the behavior of the UI component.

Subscribing to Events

You can subscribe to all events of the Form component.

The following example shows a Form configured to handle its validate, submit and clear events.

Razor

    <div id="validation-success"></div>
    @(Html.Kendo().Form<Kendo.Mvc.Examples.Models.Form.UserViewModel>()
        .Name("formExample")
        .HtmlAttributes(new { action = "Index", method = "POST" })
        .Validatable(v =>
        {
            v.ValidateOnBlur(true);
            v.ValidationSummary(vs => vs.Enable(false));
        })
        .Items(items =>
        {
            items.AddGroup()
                .Label("Registration Form")
                .Items(i =>
                {
                   i.Add()
                        .Field(f => f.FirstName)
                        .Label(l => l.Text("First Name:"));
                    i.Add()
                        .Field(f => f.LastName)
                        .Label(l => l.Text("Last Name:"));
                    i.Add()
                        .Field(f => f.UserName)
                        .Label(l => l.Text("Username:"));
                    i.Add()
                        .Field(f => f.Email)
                        .Label(l => l.Text("Email:"));
                     i.Add()
                        .Field(f => f.DateOfBirth)
                        .Label(l => l.Text("Date of Birth:").Optional(true));
                    i.Add()
                        .Field(f => f.Agree)
                        .Label(l => l.Text("Agree to Terms:"));
                });
        })
        .Events(ev => ev.ValidateField("onFormValidateField").Submit("onFormSubmit").Clear("onFormClear"))

JavaScript

    function onFormValidateField(e) {
        $("#validation-success").html("");
    }

    function onFormSubmit(e) {
        e.preventDefault();
        $("#validation-success").html("<div class='k-messagebox k-messagebox-success'>Form data is valid!</div>");
    }

    function onFormClear(e) {
        $("#validation-success").html("");
    }

Next Steps

• Using the Form Events (Demo)

See Also

• Using the API of the Form for ASP.NET MVC (Demo)
• Server-Side API of the Form
• Client-Side API of the Form