How To Check Username Already Exist In Database In Asp .NET MVC using AJAX and JQUERY

 HOW TO CHECK USERNAME ALREADY EXIST IN DATABASE IN ASP.NET MVC USING AJAX AND JQUERY 


Step 1 

Create Database along with three fields 

1) Id

2) Username

3) Email


Step 2


Create Controller in your Asp .NET MVC Project and Write the below code given below


public class HomeController : Controller { StudentEntities db = new StudentEntities(); public ActionResult Index() { return View(); } public JsonResult CheckUsernameAvailability(string userdata) { System.Threading.Thread.Sleep(200); var SeachData = db.StudentDetails.Where(x => x.StuName == userdata).SingleOrDefault(); if (SeachData != null) { return Json(1); } else{ return Json(0); } } }


Create a  View And Write Below Code In Your View :


@{ ViewBag.Title = "Home Page"; } <br /> <div class="container"> <div class="form-group"> <div class="row"> <label class="control-label col-sm-2" for="User">Username:</label> <div class="col-sm-10"> <input class="form-control" type="text" id="Username" name="Username" placeholder="Enter Username" onchange="UserCheck()"> </div> </div> <div class="row"> <label class="col-sm-2"></label> <div class="col-sm-10"> <p id="Status" /> </div> </div> <div class="row"> <label class="control-label col-sm-2" for="Pwd">Password:</label> <div class="col-sm-10"> <input class="form-control" type="Password" id="Password" name="Password" placeholder="Enter Password" onchange="UserCheck()"> </div> </div> </div> </div> <script> function UserCheck() { $("#Status").html("Checking..."); $.post("@Url.Action("CheckUsernameAvailability", "Home")", { userdata: $("#Username").val() }, function (data) { if (data == 0) { $("#Status").html('<font color="Green">Available !. you can take it.</font>'); $("#Username").css("border-color", "Green"); } else { $("#Status").html('<font color="Red">That name is taken.Try Another.</font>'); $("#Username").css("border-color", "Red"); } }); } </script>



Comments