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.
<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"))
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("");
}