FlexGrid
Unobtrusive Validation
This sample shows the basic usage of the unobtrusive validation.
Features
Sample
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.
Source
UnobtrusiveValidationController.cs
using C1.Web.Mvc; using C1.Web.Mvc.Serialization; using Microsoft.AspNetCore.Mvc; using MvcExplorer.Models; using System; using System.Collections.Generic; using System.Linq; namespace MvcExplorer.Controllers { public partial class FlexGridController : Controller { private static List<UserInfo> users = UsersData.Users; public ActionResult UnobtrusiveValidation() { return View(users); } public ActionResult GridUpdateUserInfo([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 GridCreateUserInfo([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 GridDeleteUserInfo([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)); } } }
UnobtrusiveValidation.cshtml
@using MvcExplorer.Models @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-flex-grid id="flexGrid" auto-generate-columns="false" allow-add-new="true" allow-delete="true" height="400px"> <c1-flex-grid-column binding="Id" is-read-only="true"></c1-flex-grid-column> <c1-flex-grid-column binding="Name"></c1-flex-grid-column> <c1-flex-grid-column binding="Email"></c1-flex-grid-column> <c1-flex-grid-column binding="Phone"></c1-flex-grid-column> <c1-flex-grid-column binding="Country"></c1-flex-grid-column> <c1-flex-grid-column binding="Industry"></c1-flex-grid-column> <c1-flex-grid-column binding="Birthdate" format="M/d/yyyy"></c1-flex-grid-column> <c1-items-source source-collection="Model" create-action-url="@Url.Action("GridCreateUserInfo")" delete-action-url="@Url.Action("GridDeleteUserInfo")" update-action-url="@Url.Action("GridUpdateUserInfo")"> </c1-items-source> </c1-flex-grid> @section Summary{ @Html.Raw(FlexGridRes.UnobtrusiveValidation_Text3) } @section Description{ <p>@Html.Raw(FlexGridRes.UnobtrusiveValidation_Text0)</p> <p>@Html.Raw(FlexGridRes.UnobtrusiveValidation_Text1)</p> }
UserInfo.cs
using System; using System.ComponentModel.DataAnnotations; namespace MvcExplorer.Models { public class UserInfo { public UserInfo() { Birthdate = DateTime.Now; } public int Id { get; set; } [Required] [RegularExpression(pattern: "^[a-zA-Z0-9]{4,10}$", ErrorMessageResourceType =typeof(Localization.ValidationRes), ErrorMessageResourceName = "Register_Name_ErrorMessage")] 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; } [Required] public string[] Hobbies { get; set; } } }
Documentation