Showing posts with the label Jquery

Working with Drop Down control in .Net Core MVC with steps

In previous articles we have learned about code first approach , Entity migration, crud operation in MVC .NET core, in this article i am going to demonstrate about work with drop down control in .NET Core MVC application with JQuery drop down binding. I am going to use the same application which i have used in crud operation article. So lets start the implementation.       First we need to create the City and State models for that add below classes in ModelExample project.  CityMaster.cs using System; using System.Collections.Generic; using System.ComponentModel.DataAnnotations; using System.ComponentModel.DataAnnotations.Schema; using System.Text; namespace ModelsExample { [Table("CityMaster")] public class CityMaster { [Key] [Column("Id")] public int Id { get; set; } [Column("Name")] public string Name { get; set; } [Column(" StateMasterId ")] public int StateM

Disable backspace key using Jquery

Disable backspace key in HTML form using Jquery in simple steps. While user enters data into application if user accidentally  press backspace button then it will redirect to previous page and all entered data would be lost. to eliminate this event we can disable the backspace key using Jquery. Following is the JQuery script tag you can add to the web page $(document).keydown(function (e) { var nodeName =; if (e.which === 8) { if ((nodeName === 'input' && === 'text') || nodeName === 'textarea') { // do nothing } else { e.preventDefault(); } } }); The above code can be used seamlessly with any web technology you are using. Hope this will help you in your web application. Happy coding:)

Email validation using regular expression in jQuery

To validate user input for email-id it's very easy using regular expressions. Using regular expressions you do not need to write lengthy logical code in jQuery. Following are the steps to do the same. Pass a string to RegExp or create a regex using the  // syntax Call  regex.test(string) So code would be... jQuery ( function () { $ ( ".mail" ). keyup ( function () { var VAL = this . value ; var email = new RegExp ( '^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$' ); if ( email . test ( VAL )) { alert ( 'Great, you entered an valid E-Mail-address' ); } }); });

Numeric validation on textbox/input on keydown event using JQuery

This is simple way to implement the numeric validation on textbox or input control using jquery. Firstly you need to use jquery selector for binding the keydown event to input control. Once you bind it it will only allow numeric keys and reject the alphabetical keys. Following is the code snippet of the numeric validation using Jquery. $(document).ready(function () { $("#MobileNo").keydown(function (e) { // Allow: backspace, delete, tab, escape, enter and . if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 || // Allow: Ctrl+A (e.keyCode == 65 && e.ctrlKey === true) || // Allow: home, end, left, right, down, up (e.keyCode >= 35 && e.keyCode <= 40)) { // let it happen, don't do anything return; } // Ensure that it is a number and stop the keypress if ((e.shiftKey || (e.keyCode < 48 || e.k

Populate Dropdown with jquery using JSON request in mvc3

In this Article, I am going to demonstrate to fill the dropdownlist with J query using JSON in mvc3 . To achieve this task we need to write the following JavaScript code in view ( .cshtml page). @{ ViewBag.Title = "Products"; } <script type="text/javascript"> jquery(document).ready(function () { jquery("ddlCategory").change(function () { var idModel = jquery("#ddlCategory").val(); jquery.getJSON("product/items/", { category: idModel }, function (carData) { var select =jquery("#ddlitems"); select.empty(); select.append($('<option/>', { value: 0, text: "" })); jquery.each(carData, function (index, itemData) {

Creation of Date Format function using javascript and Jquery

If you want to format the datetime string of database in your html file you need to get help from JavaScript.In javascript there is no pre define function exists to format date time string in dd MMM yyy. To accomplish the above task you need to write custom code. The following  is the custom function by using that you can format your date-time string in dd MMM yyyy format first you need to write array which has all months var gsMonthNames = new Array( 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ); Then add following function in html file function dFormat(date) { var result = ''; if (date != '') { var dateArray = date.split('/'); if (dateArray.length > 1) { result = dateArray[1] + " " + gsMonthNames[parseInt(dateArray[0])-1] + "

Enable disable all buttons of html form using Jquery

To enable disable all the buttons of html form needs to write lots of code in JavaScript. In JavaScript first we need to find all input elements which having input type submit and store it in array. After storing elements in array needs to loop that array and disable or enable element one by one. Instead of writing lots of code we can use JQuery one line code as follows $('input[type=submit']).attr('disabled',true); The above JQuery code will disable all input elements which having type submit. Happy coding...............

Get value of dropdownlist or html select using Jquery

In Jquery, you need to write one line code to get value of dropdownlist. You can use following code to get value of selected option Var selectvalue=$('#urid').val(); You can use following code to get text of selected option Var selecttext=$('#urid').text(); you are done......   Happy coding...........