ASP News->Creating a Filtering User Interface With jQuery In a Web Options

[Vault9]

jQuery is a lightweight, cross-browser JavaScript library designed to ease JavaScript's most common tasks, including inspecting and manipulating the
Document Object Model (DOM) and making out of band HTTP requests to support AJAX functionality. In plain English, jQuery makes it easy to perform client-side tasks like
adding or removing attributes or CSS classes to elements in the DOM, or showing or hiding elements on the page in response to a user action (such as clicking a button).
jQuery is used by many popular Web 2.0 sites to help implement rich, interactive features. jQuery can certainly be used in an ASP.NET application, although integrating
client-side script into a Web Forms application can sometimes be a bit trying. JavaScript development fits more naturally with ASP.NET MVC
applications; in fact, the ASP.NET MVC framework includes the jQuery libraries. What's more, Microsoft has announced that
jQuery will be included with Visual Studio 2010 and beyond.



I recently had the opportunity to use jQuery in a intranet-based line of business Web Forms application. This application has a number of reporting screens that use a
GridView control to display the report results. Users often want to filter the results to get a more concise snapshop of the data they are interested in, and to that end
many of these reports include a filtering user interface, which is a series of drop-downs, checkboxes, and textboxes, through which they can apply various filtering criteria.



Some of these filtering user interfaces have gotten so expansive that nearly an entire screen of real estate is chewed up by the filtering user interface alone!
We needed a way to collapse this filtering interface and only expand it upon user request. Using jQuery, some CSS, and a few lines of JavaScript, I was able to implement an
entirely client-side approach to expanding and collapsing the filtering interface. This article, Part 1, walks through the nuts and bolts of this functionality. The
upcoming Part 2 looks at how to extend the collapsible filtering user interface functionality so that it remembers the collapsed/expanded state on a user-by-user basis.
Read on to learn more!

Read More >



Source: http://www.4guysfromrolla.com/articles/100709-1.aspx

[Vault9]