Sorting Gridview using Jquery with ASP.NET

used table sorter plug-in which has written by Christian Bach can found http://tablesorter.com/docs/ . It is really cool plug-in and user can allow to download and customization as their wish.

I test this example in Visual Studio 2005. Some of other requirement needed is download a latest version of Jquery from official website and table sorter plug-in which can found as I mention above website.

JQuery is the most popular JavaScript library. One of the main reasons for its fame is the plugin architecture. Anyone can create a separate library that leverage the JQuery library. In this article we are going to look at the BlockUI library which is used to block the user screen while performing a task.

To enable the GridView Paging and Sorting to update the GridView Data without refreshing the ASP.Net web page AJAX Extension controls are used. UpdatePanel is used to hold the GridView control that triggers the events for the controls placed inside it. By Default UpdatePanel triggers the asynchronous postbacks for its child controls.

Continuing exploring JQuery! I decided to implement a feature to display some kind of details related to a row displayed on GridView. For example when displaying employees details on GridView some information might not fit in the GridView because it will make it huge and wide. These infomration can be diplayed as Tooltip. Or when you want to display a picture and some kind of formated text to be diplayed as tooltip when mouse hover on the image.

Im learning and experimenting with jQuery and ASP.NET. Below is a simple solution I created to highlight rows in a gridview by clicking on a checkbox next to the row.

Gridview setup:

This article explains how to use jQuery's plug-in Tablesorter to implement client-side sorting in an ASP.NET GridView. This comes in handy especially when an ObjectDataSource is used with a GridView as GridView does not provide sorting out of the box.

I was just checked how to add some more cool effects to the GridView control using JQuery. In this post I will display parent-child data in the GridView control with some help of the wonderful JQuery library.

Let's first populate the GridView control.

JQuery is the most popular JavaScript library. One of the main reasons for its fame is the plugin architecture. Anyone can create a separate library that leverage the JQuery library. In this article we are going to look at the BlockUI library which is used to block the user screen while performing a task.

The requirement of the project is to show a table of data with the riskdetails(just for assumption) which have the corresponing values for every month and people used to compare the values for last months.

Here is the code for binding the multiple drop down boxes in GridView using JQuery in ASP.NET

Im learning and experimenting with jQuery and ASP.NET. Below is a simple solution I created to highlight rows in a gridview by clicking on a checkbox next to the row.

The behavior described in this question is as expected. When you set text of a cell in grid, it directly affects HTML that is going to be rendered. When you set text value of a cell, it means that you are setting innerText of the cell. The column that GridView creates for command fields (Edit, Delete and Select) are a (anchor) or button elements. So you can see what will happen if you set text value in that cell. It will wipe out those link or button controls and replace them with simple text string.

Display a Grid on the screen with a checkbox in each row. At the bottom of the page have "Check All" button.

Typically if I need to do anything interesting I use a template column. So my GridView will look like the one below (most other columns removed for readability). The only interesting point to note is the CssClass="ApprovalCheckBox" in the CheckBox ItemTemplate.

One more article about grids from Matt Berseth. This time he shows how to create master-detail with the gridview, detailsview and jQuery's ThickBox. He writes:
So I thought I would check some of this out and along the way rebuild my Master-Detail with the GridView, DetailView and ModalPopup Controls and replace the ModalPopup with jQuery's ThickBox. I found it pretty interesting - read on to see how it went

I would like to show how to use Client Side Gridview Pagination using Jquery Table Pagination Plugin by using Ryan Zielke.

There are many times when writing an application need to display data in a table. Most of the time a simple HTML table styled with CSS is enough but occasionally want a bit more. Today we'll look at designing a plugin for jQuery that will add some advanced features such as row selection and sorting.

An example of using the jQuery ThickBox with ASP.NET's GridView and DetailView controls