使用用jQuery和QuickSearch、TableSorter插件来增强界面交互

核心提示：在用jQuery和jTemplates插件实现客户端分页的表格展现一文中我们了解过jTempalte插件，它帮助我们可以很轻松的通过订制模板来展现JSON数据集合，使用用jQuery和QuickSearch、TableSorter插件来增强界面交互，并且可以在客户端实现分页，jQuery提供了大量的Plug-in，复习

在用jQuery和jTemplates插件实现客户端分页的表格展现一文中我们了解过jTempalte插件，它帮助我们可以很轻松的通过订制模板来展现JSON数据集合，并且可以在客户端实现分页。jQuery提供了大量的Plug-in，Quick Search允许我们通过将某个HTML元素附加给Search作为数据源来在数据源中进行动态搜索；而Table Sorter插件则允许我们不用太多的代码就可以实现对表格的排序支持。今天我们就来看看如何使用Quick Search和Table Sorter插件来让我们的界面具有更好的交互性。

Quick Search

通过Quick Search你可以很容易的在你的页面中提供一个动态查询的功能，虽然这个查询只是在基于页面的某个HTML所容纳的数据作为数据源的，但这已经足够让你激动，不是吗？它确实不用你做太多的工作，仅仅是几行Javascript代码而已。

首先你需要得到QuickSearch.js，你可以从http://rikrikrik.com/jquery/quicksearch/#download下载得到。然后我们就来构建一个页面吧，复习一下上次的内容，用jQuery来调用页面内的方法并通过模板来显示数据。很简单，我们声明一个页面方法来获取cnBlogs首页的blog列表：

[WebMethod]
　　public static IEnumerable GetBlogList()
　　{
　　　　string strBlogUrl = "http://www.cnblogs.com/rss";
　　　　XDocument doc = XDocument.Load(strBlogUrl);
　　　　var items = from item in doc.Descendants("item")
　　　　　　　　　　select new
　　　　　　　　　　{
　　　　　　　　　　　　Title = item.Element("title").Value,
　　　　　　　　　　　　Link = item.Element("link").Value,
　　　　　　　　　　　　Author = item.Element("author").Value,
　　　　　　　　　　　　Published = System.DateTime.Parse(item.Element("pubDate").Value).ToShortDateString(),
　　　　　　　　　　　　Description = item.Element("description").Value
　　　　　　　　　　};
　　　　return items;
　　}