At times, instead of normal display of validation error messages (or even in the validation summary) on the page, we tend to display them in more user friendly manner. This Jumpstart deals with the using JavaScript to get the above shown validation error display formats. The main concentration laid on especially 3 different formats – 1) Water Marking 2) Error Images (beside TextBox) and 3) Alert Dialog. The before mentioned effects can be easily achieved with some quick JavaScript. In this tutorial, we use 3 JavaScript functions to get more flexible user interactivity with the page, they are – validate(), resetValidation(event) and singleValidation(event). In the following code sample we use three simple TextBox and RequiredFieldValidator pairs to demonstrate the validation error effects.
Most Popular (Last 7 days)
- How to send an Email using C# - complete features
- Sending Automated Emails asynchronously using a C# Windows Service in conjunction with Database Email records PART - II
- JQuery POST & GET Request to WCF Service in ASP.Net MVC
- Create a Simple WCF service against Pubs Database using EF, LINQ – Part I
- Sending Automated Emails asynchronously using a C# Windows Service in conjunction with Database Email records – Part I
- Create a Simple WCF Service Client against Pubs Database using EF, LINQ – Part II
- Access Code-behind variables in ASPX and JavaScript
- Simple Html Editor based Comments Section with Captcha feature along with Database Interactivity
- ASP.Net MVC–Simple Application Security using Password Hashing before storing it to Database
- Access JavaScript Variables in Code-Behind Class
Most Popular (All time)
- How to send an Email using C# - complete features (29548 views )
- Sending Automated Emails asynchronously using a C# Windows Service in conjunction with Database Email records PART - II (18382 views )
- Create a Simple WCF service against Pubs Database using EF, LINQ – Part I (11907 views )
- JQuery POST & GET Request to WCF Service in ASP.Net MVC (11802 views )
- Access Code-behind variables in ASPX and JavaScript (11348 views )
- Sending Automated Emails asynchronously using a C# Windows Service in conjunction with Database Email records – Part I (11262 views )
- Create a Simple WCF Service Client against Pubs Database using EF, LINQ – Part II (9231 views )
- Access JavaScript Variables in Code-Behind Class (8631 views )
- Simple Html Editor based Comments Section with Captcha feature along with Database Interactivity (8149 views )
- Data Transfer between two ASP.NET Pages (7873 views )
- Save the World (6710 views )
- Retrieve files from a table in Database using Generic Handler (5646 views )
- Save files to a table in Database using FileUpload control (5521 views )
- ASP.Net MVC–Simple Application Security using Password Hashing before storing it to Database (5326 views )
- How to download files from server to client using a Generic Handler (4340 views )
- AJAX HTML Editor based Contact Form inside UpdatePanel along with UpdateProgress (4263 views )
- JQuery Quickies #1 – GalleryView Plugin by Jack Anderson (3817 views )
- Book Review - MCTS Exam 70-536 Microsoft .NET Framework – Application Development Foundation Self Paced Training Kit - Tony Northrup (3491 views )
- Implementing MVP Pattern using UserControls with WCF Database Operations in Entity Framework and LINQ – PART I (3352 views )
- File Download by Anil (3330 views )
JumpStart Tutorials
- JumpStart # 11 - Xml Comments for code using GhostDoc Extension
- JumpStart # 10 – Display Validation Error Messages in different formats using JavaScript
- JumpStart # 9 – Make Response.Redirect() open in New Blank Window
- JumpStart # 8 – Making Client CallBacks by Implementing ICallBackEventHandler Interface
- JumpStart # 7 – Handling UserControl’s Event from Parent Page
- JumpStart # 6 – Accessing CheckBoxList Control in JavaScript and making a Mandatory Selection Enabled
- JumpStart # 5 – Access Properties of a UserControl from other UserControl in ASP.Net Page
- JumpStart # 4 – validateRequest in ASP.Net
- JumpStart # 3 – ViewStateMode in ASP.Net 4.0
- JumpStart # 2 – OUT Parameter in C#
- JumpStart # 1 - Using Optional And Named Parameters in C#
Latest Entries
JumpStart # 10 – Display Validation Error Messages in different formats using JavaScript
RamiVemula on September 3, 2010 at 1:24 pm
JumpStart # 9 – Make Response.Redirect() open in New Blank Window
RamiVemula on August 30, 2010 at 12:48 pm
1) The main motive behind writing this code snippet is that this topic has been asked number of times @forums.
2) Response.Redirect() by itself never opens a page in a new blank window, so the trick lies in using the JavaScript. We use the OnClientClick property of the Button to open a new window.
3) The credit of the code goes to a MSFT (I never knew his name) for providing this sample @forums.
Simple Html Editor based Comments Section with Captcha feature along with Database Interactivity
RamiVemula on August 29, 2010 at 7:32 pm
In this tutorial, we see how to develop a simple comments section. This comments section is going to be a similar one to what we usually see in our day to day experience. Here we use TinyMCE editor to enable Html Comments. And also catpcha is enabled (with the help of reCaptcha of Google). The basic outline would be – Users provide their general details like name and email, and also they can provide Html Comment (using TinyMCE), and finally they should enter the text showed in the captcha for validating robots. Then we take the Html string, encode it using HtmlEncode(), store it in database. Finally we retrieve the encoded string from the database, we then decode it and display it in the page as Comment.
JQuery Quickies #2 – LightBox Plugin by Leandro Vieria Pinho
RamiVemula on August 14, 2010 at 8:21 pm
In this tutorial, I create a sample Database “Example” with a table “Images” which holds the information about images like ImageName, ImageDescription and ImagePath. Then I use a SqlDataSource in combination with Repeater to display the images from the database onto the page. Here we use LightBox plugin to open up a modalpopup window with the details of the image (shown in modalpopup) along with the flexibility of navigating between images without closing the modalpopup.
Filed under:JQuery
JQuery Quickies #1 – GalleryView Plugin by Jack Anderson
RamiVemula on August 13, 2010 at 1:41 am
In this tutorial, I create a sample Database “Example” with a table “Images” which olds the information about images like ImageName, ImageDescription and ImagePath. Then I use a SqlDataSource in combination with Repeater to display the images from the database onto the page. Here we use GalleryView to make the slideshow of images in the repeater along with display of the particular image which is in focus.
Filed under:JQuery
JumpStart # 8 – Making Client CallBacks by Implementing ICallBackEventHandler Interface
RamiVemula on August 12, 2010 at 1:31 am
In this tutorial, we first create a Database and store the necessary details of the Images like ImageName, ImagePath (physical directory path in relative URL), ImageDescription etc. Then we display these images on the web page using a Repeater in combination with SqlDataSource. After this we use Client CallBack to display the details of corresponding image on which mouse is hovered. CallBacks are accomplished by implementing ICallBackEventHandler.
JumpStart # 6 – Accessing CheckBoxList Control in JavaScript and making a Mandatory Selection Enabled
RamiVemula on June 23, 2010 at 9:12 pm
Before looking at the code, Read about – What is JumpStart? The following code presents a Mandatory (Required) CheckBoxList with a Default Selection. <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> protected void Page_Load(object sender, EventArgs e) { /* The purpose of adding onclick to individual items is [...]
Access JavaScript Variables in Code-Behind Class
RamiVemula on January 24, 2010 at 7:29 pm
After writing the article on how to “Access Code-Behind variables in ASPX and JavaScript”, my focus continued on this particular counteract concept. At times we got to transfer some data from client side JavaScript to code-behind on some particular requirements. For example when the screen resolution of the client’s web browser is needed to be known in code-behind, then the simple way to accomplish is to access JavaScript variable in Code-Behind.Read More…
Filed under:ARTICLE
Access Code-behind variables in ASPX and JavaScript
RamiVemula on January 1, 2010 at 11:45 am
I often come across this question not only in the Worldwide Web but also in many development scenarios. In fact this is the question which I faced when I started programming years back. At times we need to change some of the properties of the server side controls from code-behind partial class and also sometimes we are required to process some data on the client side JavaScript which we get from code-behind. In those cases, accessing code-behind variables in ASPX is the easiest way to get our job done.Read More…
Filed under:ARTICLE