Features
- Overview
- Collapsible Column Headers
- Styling Records, Groups, and Cells
- Grouping
- Group Headers
- Row Header
- Filtering
- Row and Column Freezing
- Paging
- Group Panel
- Remote Data Binding
- Custom Cells
- Custom Editors
- Custom Column Headers
- Editing
- Batch Editing
- Sorting
- Virtual Scrolling
- Disable Server Reading
- Data Map
- Excel Export
- PDF Export
- Unobtrusive Validation
Unobtrusive Validation
Unobtrusive Validation
This sample shows the basic usage of the unobtrusive validation.
Features
Id
Industry
Email
Phone
Birthdate
1
John
Albania
1424685445
Computers
John@gmail.com
1/1/2001
2
Mary
American
1296479754
Electronics
Mary@gmail.com
3/2/1985
3
David
Australia
1217654653
Telecom
David@gmail.com
3/1/1999
4
Sunny
Bosnia
1756456786
Internet
Sunny@gmail.com
4/3/1989
5
James
Botswana
1209687543
Accounting
James@gmail.com
3/2/1994
6
Maria
Bahrain
1543578643
Accounting
Maria@gmail.com
4/2/1998
7
Michael
Argentina
1215457467
Finance
Michael@gmail.com
2/2/2003
8
Michelle
Bulgaria
1534357546
Finance
Michelle@gmail.com
1/1/2001
Id
Name
Country
Phone
Industry
Email
Birthdate
0
Description
This sample shows the basic usage of the unobtrusive validation.
The columns have the following validations:
- Name: Required. Alphanumeric and contains 4 to 10 characters.
- Industry: Required.
- Country: Required.
- Phone: Required. 8 to 11 characters.
- Email: Required. Valid e-mail address.
- Birthdate: Required.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 | using C1.Web.Mvc; using C1.Web.Mvc.Serialization; using MultiRowExplorer.Models; using System; using System.Collections.Generic; using System.Linq; using Microsoft.AspNetCore.Mvc; namespace MultiRowExplorer.Controllers { public partial class MultiRowController : Controller { private static List<UserInfo> users = UsersData.Users; public ActionResult UnobtrusiveValidation() { return View(users); } public ActionResult MultiRowUpdateUserInfo([C1JsonRequest]CollectionViewEditRequest<UserInfo> requestData) { return this .C1Json(CollectionViewHelper.Edit<UserInfo>(requestData, item => { string error = string .Empty; bool success = true ; try { var resultItem = users.Find(u => u.Id == item.Id); var index = users.IndexOf(resultItem); users.Remove(resultItem); users.Insert(index, item); } catch (Exception e) { error = e.Message; success = false ; } return new CollectionViewItemResult<UserInfo> { Error = error, Success = success, Data = item }; }, () => users)); } public ActionResult MultiRowCreateUserInfo([C1JsonRequest]CollectionViewEditRequest<UserInfo> requestData) { return this .C1Json(CollectionViewHelper.Edit<UserInfo>(requestData, item => { string error = string .Empty; bool success = true ; try { users.Add(item); item.Id = users.Max(u => u.Id) + 1; } catch (Exception e) { error = e.Message; success = false ; } return new CollectionViewItemResult<UserInfo> { Error = error, Success = success, Data = item }; }, () => users)); } public ActionResult MultiRowDeleteUserInfo([C1JsonRequest]CollectionViewEditRequest<UserInfo> requestData) { return this .C1Json(CollectionViewHelper.Edit<UserInfo>(requestData, item => { string error = string .Empty; bool success = true ; try { var resultItem = users.Find(u => u.Id == item.Id); users.Remove(resultItem); } catch (Exception e) { error = e.Message; success = false ; } return new CollectionViewItemResult<UserInfo> { Error = error, Success = success, Data = item }; }, () => users)); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | @model List< UserInfo > @section Scripts{ <script src="~/Scripts/jquery.js"> </script> <script src="~/Scripts/jquery.validate.js"> </script> <script src="~/Scripts/jquery.validate.unobtrusive.js"> </script> } < c1-multi-row id = "uvMultiRow" class = "multirow" allow-add-new = "true" allow-delete = "true" > < c1-items-source source-collection = "Model" create-action-url = "@Url.Action(" MultiRowCreateUserInfo ")" delete-action-url = "@Url.Action(" MultiRowDeleteUserInfo ")" update-action-url = "@Url.Action(" MultiRowUpdateUserInfo ")" > </ c1-items-source > < c1-multi-row-cell-group > < c1-multi-row-cell binding = "Id" is-read-only = "true" ></ c1-multi-row-cell > </ c1-multi-row-cell-group > < c1-multi-row-cell-group > < c1-multi-row-cell binding = "Name" ></ c1-multi-row-cell > < c1-multi-row-cell binding = "Industry" ></ c1-multi-row-cell > </ c1-multi-row-cell-group > < c1-multi-row-cell-group colspan = "3" > < c1-multi-row-cell binding = "Country" ></ c1-multi-row-cell > < c1-multi-row-cell binding = "Phone" colspan = "2" ></ c1-multi-row-cell > < c1-multi-row-cell binding = "Email" colspan = "2" ></ c1-multi-row-cell > < c1-multi-row-cell binding = "Birthdate" format = "M/d/yyyy" ></ c1-multi-row-cell > </ c1-multi-row-cell-group > </ c1-multi-row > @section Description{ < p > @Html .Raw(MultiRowRes.UnobtrusiveValidation_Text0)</ p > < p > @Html .Raw(MultiRowRes.UnobtrusiveValidation_Text1)</ p > } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | using System; using System.ComponentModel.DataAnnotations; namespace MultiRowExplorer.Models { public class UserInfo { public UserInfo() { Birthdate = DateTime.Now; } public int Id { get ; set ; } [Required] [RegularExpression(pattern: "^[a-zA-Z0-9]{4,10}$" , ErrorMessage = "The username must be alphanumeric and contains 4 to 10 characters." )] public string Name { get ; set ; } [Required] [EmailAddress] public string Email { get ; set ; } [Required] [MinLength(6)] [MaxLength(16)] public string Password { get ; set ; } [Required] [Compare( "Password" )] public string ConfirmPassword { get ; set ; } [Required] [MinLength(8)] [MaxLength(11)] public string Phone { get ; set ; } [Required] public string Country { get ; set ; } [Required] public string Industry { get ; set ; } [Required] public DateTime Birthdate { get ; set ; } [Required] public string FavoriteColor { get ; set ; } [Required] [MinLength(2)] [MaxLength(3)] public string [] Skills { get ; set ; } } } |