We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Essential JS2

Syncfusion jQuery based widgets are no longer in active development. Switch to our pure JavaScript based next generation Essential JS 2 library.

Syncfusion Feedback

How to use the jQuery Validation in the Editor Type control?

Platform: jQuery |
Control: General

The jQuery validate plugin makes simple clientside form validation easy while still offering plenty of customization options. The plugin comes with a useful set of validation methods including URL and email validation, while providing an API to write your own methods to validate the form element.

Use JQuery validation

The jQuery validate plugin rules and custom methods can be used in the editor type control with the help of two properties, the validationRules and the validationMessage. The validationRules property is used to define the jQuery validate rules for the control and validationMessage is used to define the respective error message for the rules that are specified in the validationRules property. When error message is not specified to the validation rules, it takes the default validation error message. The validationRules and validationMessage properties work within a form element, otherwise it does not work. Before using those properties, you need to add the jQuery validate plugin to your application. Syncfusion has provided the following properties to the list of control.

  1. Date Picker.
  2. DateTimePicker.
  3. Numeric, Currency and Percentage textbox.   
  4. Mask Edit Textbox. 
  5. Autocomplete and Dropdown.
  6. Checkbox and Radio button.

You can define the validationRules and the validationMessage properties to the control as shown in the following code:


<input id="date" name="datepick" type="text" />
<script type="text/javascript">
        $(function () {
                validationRules: { required: true },
                validationMessage: { required: "Required Date value" }


@Html.EJ().DatePicker("date").ValidationRules(e=>e.AddRule("required",true)).ValidationMessage(m=>m.AddMessage("required","Required Date Value"))

You can also define the validationRules and validationMessage properties to other list of controls. 

A sample jQuery validation is available in the following location: Sample location

You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile