Monday, August 25, 2014

How to implement Remote Validation in MVC


Here I am going to implement Remote Validation functionality in MVC.

First question came in mind when I heard about ‘Remote Validation’ is.
Why is it required?

Answer is, In MVC sometime require on the fly validation on some unique field like Username, Product Name, Barcode etc. On this type of requirement we can used Remote Validation.

What is unique ?
Remote Validation


My Scenario: I have one sql table Product with different column like ProductId,  ProductName and ProductPrice. In this sql table ProuctName should be unique. And validate this field on the fly without refresh the browser.



Solution:

Step 1: Create model for Product and apply remote validation via Data Annotation.

 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.ComponentModel.DataAnnotations;  
 using System.Web.Mvc;  
 namespace Product.Models  
 {  
   public class Product  
   {  
     [Required]  
     public long ProductId { get; set; }  
     [Required]  
     public decimal ProductPrice { get; set; }  
     [Required]  
     [Remote("IsProductNameUnique","Product",AdditionalFields="ProductName",ErrorMessage="This {0} is already used.")]  
     public string ProductName { get; set; }  
   }  
 }  

Step 2: Create method in controller to check the validation for that column. You can also send the additional parameters by adding AdditionFields attribute.


 using System;  
 using System.Collections.Generic;  
 using System.Linq;  
 using System.Web;  
 using System.Web.Mvc;  
 using ItemCatalog.Models;  
 namespace Product.Controllers  
 {  
   public class ProductController : Controller  
   {  
     public ActionResult Product()  
     {  
       Product objProduct = new Catalog();  
       return View(objProduct);  
     }  
     public JsonResult IsProductNameUnique (Product objProduct)  
     {  
       return IsExist(objProduct.ProductName)  
         ? Json(true, JsonRequestBehavior.AllowGet)  
         : Json(false, JsonRequestBehavior.AllowGet);  
     }      
   }  
 }  

Step 3: Create view from created Product model.


 @model ItemCatalog.Models.Catalog  
 @{  
   ViewBag.Title = "Catalog";  
   Layout = "~/Views/Shared/_Layout.cshtml";  
 }  
   <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>  
   <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>  
 }  
 <h2>  
   Item</h2>  
 @using (Ajax.BeginForm("SaveCatalog", new AjaxOptions { HttpMethod = "POST"}))  
 {   
   <fieldset>  
     <div>  
       @Html.TextBoxFor(x => x.ProductName, Model.ProductName)  
       @Html.ValidationMessageFor(x => x.ProductName)  
     </div>  
     <div class="row">  
       @Html.TextBoxFor(x => x.ProductPrice, Model.ProductPrice)  
       @Html.ValidationMessageFor(x => x.ProductPrice)  
     </div>  
   </fieldset>  
   <div>  
     <input type="submit" value="Save" />  
   </div>  
 }