Gridview Paging With TableSorter Pager Plugin

Introduction:  In the previous article i have illustrated how we can use table sorter plugin into ASP.NET GridView Control to sort records displayed in gridview at client side without consuming server resources..This article describes the implementation of Pager ad-on of the table sorter plugin with GridView in ASP.NET to display paged records at the client side. So without making any post back you would be able to display desired no of records in gridview. So this would be a great approach if your application is going to contains large chunk/amount of data  that need to sort and display at client side.

Sort GridView Using Table Sorter At Client Side

Introduction:

First of all i would like to introduce you with the table sorter. It's an add-on that uses jQuery plugin to sort the table at client. Since we are sorting table at client side so no server resources is being consumed and no post back occurs and no load on server side for sorting the table. you can download this plugin from the following website www.tablesorter.com .Christian Bach is the author of this plugin which did a fantastic job.

Display Watermark Using jQuery For TextBox Controls

Introduction:  In this article i  will demonstrate how we can show watermark effect in asp.net textbox controls using jQuery.

Procedure: Follow these steps.

1. Download the java script that i have created for jquery by clicking this link.

2. Pass the reference of this java script in the head section as follows.

<script src="../Scripts/WaterMark.min.js" type="text/javascript"></script>

How to display an image gallery using Repeater in ASP.NET

Introduction: Hey guys in this article i am going to demonstrate that how we can display an image gallery using repeater in ASP.NET. Its very simple and just follow following steps.

Procedure:

1. Either create a new page or project.

2. Drag and drop a  FileUploader and a Button control in your ASPX page.

3. To display a gallery put a Repeater control in the page.

4. In the <ItemTemplate > section of repeater put an image control to display images. Set height and width of this image control.

Display Tooltip On Mouse Hover Using jQuery UI

Introduction: In this article i am going to explain that how we can show tolltip at mouse hover event on any html control using jquery UI.

Description: Its very simple and just follow these steps.

1. Add reference of jQuery1.9 UI in the aspx page or master page in between <Script> tag

2. Set Title attribute to those html controls for whom you want to show tooltip.

3. Add following method to display tooltip for all control in the html page in between <Script> tag.

$(function () {

         $(document).tooltip();

})

This method will display tooltip for all the controls in html page whose title attribute is set.

$(function () {

         $('#'txtName).tooltip();

})

However if you want to display tooltip only for selected controls then instead of (doument) you will have to use id (#'txtname') eg of that specific controls.

4. Run your page in the browser to see the effect.

Example: