Using Remote Attribute for Remote Site Validation MVC

Introduction

This code will just give you brief overview of how you can use Remote Attribute. I am not going into the details, just like to share you my experience while using Remote Attribute for Remote side validation.

Background 

I was trying to implement Remote Site Validation in MVC using Remote attribute. I come across a problem where my remote method doesn't get called while trying to do validation on remote side. I spend almost my whole day to figure out the problem, but unfortunately on internet i couldn't find the solution of my problem. That encourage me to write down this article so if you get stuck in same situation, you dont have to spend all your day to figure out the problem. 

I just like to share you the solution of the problem i was facing. I had the Remote method that i was trying to call using jQuery. This method has one integer parameter. The problem was that my remote method doesn't get called if your parameter is integer. So i change the type of my parameter from integer to string, then all start works fine.  

Using the code 

Step 1: Open Visual Studio and select ASP.NET MVC 4 application template with default settings.  

Step 2: In Solution Explorer, right click on Models folder --> Add  New Item --> select class. 

Step 3: Type in the class name as RemoteValidator.vb. Then copy paste the following code in RemoteValidator.vb.   

Imports System.ComponentModel.DataAnnotations
Public Class RemoteValidator    
<Required()> _
<Display(Name:="Test Number")> _
<Remote("IsNumberEven", "Home")> _
Public Property TestNumber As Integer
' First argument is Action name and second argument is Controller Name.    
End Class        

Step 5: Add the following code at the end of controller.  

Function RemoteValidator() As ActionResult
       ViewData("Message") = "Remote Validator Page"
       Return View()
   End Function

   <AllowAnonymous()> _
   Public Function IsNumberEven(evenNumber As String) As JsonResult
       'Return Json(evenNumber Mod 2 = 0, JsonRequestBehavior.AllowGet)

       If CInt(evenNumber) Mod 2 = 0 Then
           Return Json("The number is even", JsonRequestBehavior.AllowGet)
       Else
           Return Json("The number is odd", JsonRequestBehavior.AllowGet)
       End If
   End Function

Step 6: Right click on Views--> Home and add new view named RemoteValidator.vbhtml. Your view should look like this: 

@ModelType RemoteValidatorDemo.RemoteValidator
 
@Code
    ViewData("Title") = "RemoteValidator"
    Layout = "~/Views/Shared/_Layout.vbhtml"
End Code
 
@Using Html.BeginForm()
     @Html.AntiForgeryToken()
    @Html.ValidationSummary()
     @Html.LabelFor(Function(m) m.TestNumber)
    @Html.TextBoxFor(Function(m) m.TestNumber)
     @Html.ValidationMessageFor(Function(m) m.TestNumber) 
 
 
 @<input type="submit" value="submit" />
End Using
 
@Section Scripts
    @Scripts.Render("~/bundles/jqueryval")
End Section

Now if you run your application and access your remotevalidator view by using the following URL, you will see after typing in the number that if number is odd or even.  

http://localhost:64160/home/remotevalidator

(Note: change the port number according to your machine port number.)