[Solved] How to trigger validation of a Telerik Mvc Grid

[Martin]

I want to validate the whole grid when/after the grid has loaded through ajax an ajax call.
I would like to do this with Telerik ASP.NET MVC grid but have not found a solution.  


I know that I can trigger a validation of a form, that uses jquery validate by calling this javascript code:

$("form").valid();

I am trying to add this functionality to the example code found on this link:  Telerik ASP.NET MVC grid  

Any suggestions?

[Reid]

Hello Martin,

If you want to control the validation of the Grid it comes down to the valdidation of the Model object that the grid is bound to, either server or client side.  So the steps would be the following. (others please correct me if I am wrong here ..)

Adorn your properties of the object with the right data annotations.

[StringLength(255, ErrorMessage = "Title must be 255 characters or less in length.")]
[Required(ErrorMessage = "Title is required")]
public string Title { get; set; }

[StringLength(255, ErrorMessage = "Email must be 255 characters or less in length.")]
[Required(ErrorMessage = "Email is required")]
[DataType(DataType.EmailAddress)]
[DisplayName("Email Address")]
public string Email { get; set; }


[StringLength(255, ErrorMessage = "Phone number must be 255 characters or less in length.")]
[Required(ErrorMessage = "Phone number is required")]
[RegularExpression(@"^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$", ErrorMessage = "Phone must be a valid phone number.")]
[DisplayName("Phone Number")]
public string PhoneNumber { get; set; }

This is what the Grid uses depends on because through the .NET framework to enforce the meta data rules and display detail per column (model class member).

The second part, if you want to get control over the validation process you can implement the IValidableObject interface in your model class and nested classes ..  Here is an example .


using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;

public class UserModel : ModelBase  , IValidatableObject

{

 

 

 

    [StringLength(255, ErrorMessage = "Title must be 255 characters or less in length.")]

    [Required(ErrorMessage = "Title is required")]

    public string Title { get; set; }

 

    [StringLength(255, ErrorMessage = "Email must be 255 characters or less in length.")]

    [Required(ErrorMessage = "Email is required")]

    [DataType(DataType.EmailAddress)]

    [DisplayName("Email Address")]

    public string Email { get; set; }

 

 

    [StringLength(255, ErrorMessage = "Phone number must be 255 characters or less in length.")]

    [Required(ErrorMessage = "Phone number is required")]

    [RegularExpression(@"^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$", ErrorMessage = "Phone must be a valid phone number.")]

    [DisplayName("Phone Number")]

    public string PhoneNumber { get; set; }

 

 

 

    public UserModel() : base ()

    {

 

 

    }

 

 

 

    #region IValidatableObject Interface Requirements

    public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)

        {

             

 

            if ( string.IsNullOrWhiteSpace(Title) )

            {

                yield return new ValidationResult("Title is required");

            }

 

 

 

            if ( string.IsNullOrWhiteSpace(Email) )

            {

                yield return new ValidationResult("Email is required");

            }

 

 

            if ( string.IsNullOrWhiteSpace(PhoneNumber) )

            {

                yield return new ValidationResult("Phone Number is required");

            }

       }

    #endregion 

 

 

 

}

Next in the Controller action that recieves the Postback from the View, you can use the TryUpdateModel() method to start the validation process, .NET will delegate validation to you with this is place. If you place a breakpoint in the Interface implementation (above) you can see it working.

[HttpPost]
[AcceptVerbs(HttpVerbs.Post)]
[GridAction]
public ActionResult _AjaxUpdateUser(UserModel viewModel)
{

if ( TryUpdateModel(viewModel) )
{

   // Update User here
   TransactionResult userTransactionResult = UserProvider.UpdateUser(viewModel);
    switch ( userTransactionResult.State )
     {
        case TransactionStateEnum.Duplicate:
        {
          ModelState.AddModelError("Roles", "Duplicate User Name or Email Detected.");
          break;
        }
        case TransactionStateEnum.Rejected:
        {
          ModelState.AddModelError("Roles", "The transaction that updates the User failed.");
          break;
        }
        case TransactionStateEnum.Success:
        {
          ModelState.AddModelError("Roles", "The user was successfully updated.");
          break;
        }


       }

 }

   // Refresh the grid, here showing as search for the updated user.

   viewModel.SearchCriteria = new SeachCriteria() {UserEmail = viewModel.Email};
   SetViewData();
   return View(new GridModel<UserModel>
   {
     Data = _AjaxUserSearch(viewModel)
   });

}

Hope this helps.

Reid