Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Expand]WinForms Controls
[Collapse]ASP.NET Controls and MVC Extensions
 [Expand]Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]ASP.NET WebForms Controls
 [Collapse]ASP.NET MVC Extensions
  [Expand]Product Information
  [Expand]Getting Started
  [Expand]Common Concepts
  [Expand]Grid View
  [Expand]Card View
  [Expand]Vertical Grid
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]HTML Editor
  [Expand]Image and Data Browsing
  [Expand]Docking and Popups
  [Expand]Navigation and Layout Extensions
  [Expand]File Management
  [Expand]Multi-Use Site Extensions
  [Expand]Charts
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Tree List
  [Collapse]Data Editor Extensions
    Editor List
    Main Features
   [Collapse]Common Concepts
     Binding Data Editors to Data
     Getting Editor Values
     Mask Editing
    [Collapse]Validation
      Validation Overview
      Model Validation
      Unobtrusive Client Validation
      jQuery Client Validation
      Built-in Validation
      Remote Validation
      Displaying Validation Error Messages
      Validating Dynamically Loaded Forms
     Accessibility Support
   [Expand]Editor Types
   [Expand]Strongly-Typed Editor Types
  [Expand]Report Extensions
  [Expand]SpellChecker
 [Expand]Localization
 [Expand]Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

jQuery Client Validation

ASP.NET MVC supports client side validation that is based on the jQuery Validation plugin. Client side validation can be performed directly using the jQuery javascript library without ASP.NET MVC resources. The jQuery Validation plugin validates the form before it is submitted: if the form is not valid, it won't be submitted.

Important

jQuery Validation requires your input data editors to be inside of a <form> element in order to be validated.

DevExpress MVC data editors support jQuery based client-side validation.

To implement user-input validation within DevExpress MVC Data Editors, perform the following steps.

Expanded Including JS references

The jQuery Validation requires the jquery-1.*.*.min.js and jquery.validate.min.js JavaScript references to be included to your layout or master page (or to a certain views that contain validating forms).

The code sample below demonstrates how to include the required javascript references (using Razor View Engine in MVC 3).

Razor v2 (which is used in MVC 4) allows you to add the same script references in the following way.

Important

The JavaScript references should be added in the order they are specified in the code sample above.

Expanded Setting jQuery validation attributes

The JQuery Validation plugin provides you with a number of built-in standard validation methods. Follow this link to learn more about built-in validation methods: List of built-in Validation methods (http://jqueryvalidation.org/documentation)

The code sample below demonstrates how to define jQuery Validation methods for a data editor.

Important

The jQuery Validation rules do not work if the jQuery.Validate.Unobtrusive plugin is attached. This plugin is automatically attached if the "resources" section of the Web.config file has a reference to "ThirdParty" libraries.

jQuery client validation will work if the required client libraries are manually attached (and an empty "resources" section is declared in the Web.config).

Expanded Displaying validation error messages

You have the ability to use different approaches to displaying validation error messages: standard ValidationMessageFor() method, DevExpress MVC editors specific placeholder and DevExpress Validation Summary. You can find these approaches described here: Displaying Validation Error Messages.

Note

The standard ValidationSummary() method doesn't allow you to render error placeholders if you use jQuery Client Validation approach. In this case, you can use the DevExpress ValidationSummary MVC Extension that renders jQuery Client Validation errors correctly.

Expanded See Also

How would you rate this topic?​​​​​​​