用jQuery和jTemplates插件实现客户端分页的表格展现(2)

By | 09月28日
Advertisement

  在上边的方法中设定了RSS的地址,并通过LINQ to XML来取得我们想要的属性。Skip和Take函数联合起来实现了一个分页的功能。

  通过jQuery调用Page Method

  jQuery.Ajax方法实现了用Ajax的方式来请求一个页面并设定回调函数来处理相应状态和结果。在我们的实例中,需要请求上边写的PageMethod并处理返回结果。

function DisplayRSS(page) {
  $.ajax({
    type: "POST",
    url: "Default.aspx/GetFeeds",
    data: "{'PageSize':'" + pageSize + "', 'PageNumber':'" + page + "'}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(msg) {
      //TODO:Show the result as a table.      
      alert(msg);
    }
  });
}

  在success的回调函数中我们什么也没有做,先来看看result到底是个什么东西。在浏览器中设置允许调试脚本,定义一个函数供回调函数中调用,然后设定断点在新的函数中。

  我们看到在服务端将数据以IEnumerable返回后实际上在result中包含的是一个JSON表示的数据集合。每个对象含有Date, Description, Link和Title属性,这和前边用LINQ取XML字段时是相符的。因为你已经拥有了这个数据集合,接下来所要做的就是在客户端通过某种方式展现出来。你也许会想到用动态拼接Table的方式来做,但这并不灵活。jTemplates提供了更优雅的方式来实现

  用jTemplate来展现数据

具体:http://www.verydemo.com/demo_c110_i26789.html

Similar Posts:

  • 利用jquery插件在客户端计算“过了多少时间”

    项目中有一个需求,是需要计算上次上传文件到现在过了多少时间,由于种种原因,这个时间需要在客户端进行计算,于是自己写了一个方法进行计算,结果发现jquery的一个插件更好的解决了这个问题. http://timeago.yarp.com/ 很不错的插件,推荐!

  • 精心收集的jQuery常用的插件1000

    1.accordion类 基于jQuery开发,非常简单的水平方向折叠控件. Horizontal accordion: jQuery 热点图书:www.hotbook.cn jQuery-Horizontal Accordion 具有XBOX360 blade界面风格的水平方向Accordion. jQuery-Horizontal Accordion jQuery plugin: Accordion 用于创建 折叠菜单的jQuery插件. jQuery plugin: Accordion 热

  • Maplace.js – 小巧实用的 jQuery 谷歌地图插件

    Maplace.js是一个小的显示谷歌地图的 jQuery 插件,帮助你把谷歌地图嵌入到你的网站,快速在地图位置上创建标记和控制菜单.它需要 jQuery 和谷歌地图 API v3 支持,所以这两个都需要引入到你的页面.它支持标记和自定义图标.缩放级别和自定义控件菜单. 您可能感兴趣的相关文章 10款唯美浪漫的婚礼 & 结婚纪念网站模板 那些让人惊叹的的国外创意404错误页面设计 10大流行的 Metro UI 风格 Bootstrap 主题 推荐35款精致的 CSS3 和 HTML5 网页模板

  • VC知识库文章 - DataGrid的客户端分页

    DataGrid的客户端分页 原著: 翻译: 原文出处: () 原代码下载: (120KB) 开发人员对ASP.NET中的DataGrid控件又爱又恨.一方面,DataGrids大大简化了在HTML中通过表格中描述数据源,另一方面,DataGrid在服务器端如此重要,导致了大量的页面请求被传回服务器.例如,当用户使用分页DataGrid时,从一个页面转到另一个页面就会导致页面请求传回服务器.这样就会降低系统的性能.毫无疑问,广大开发人员的心愿就是有一种好的DataGrid,能够使包括数据记录的页

  • jQuery的DataTables插件的使用方法[转]

    jQuery的DataTables插件的使用方法[转] 转自:http://www.guoxk.com/node/jquery-datatables 在做后台的时候并没有美工和前端工程师来配合你做页面,为了显示数据并有一定的美感,我们可以使用jQuery的DataTables插件来帮助我们完成任务 1.DataTables的默认配置 $(document).ready(function() { $('#example').dataTable(); } ); 示例:http://www.guoxk

  • 网站建设中可能需要的JQuery无限滚动插件

    现在,最热门的网站分页趋势之一是jQuery的无限滚动(瀑布流).如果你碰巧观察Pinterest的网站,如Facebook,Twitter和deviantART的,你会发现无限滚动的动作,当旧的内容自动加载,当你到达页面底部的.这将鼓励访客的网站停留更长的时间,并进一步阅读的网站提供更多相关的内容,无需用户任何操作自动. 从设计和可用性的角度来看,无限滚动导航容易的,因为内容的加载方式,无需额外的页面加载和没有任何积极的行动,需要从访问者.有了这样的技术,无限滚动的网站有更多的机会获得比传统的

  • DataGrid的客户端分页

    DataGrid的客户端分页 原著: 翻译: 原文出处: () 原代码下载: (120KB) 开发人员对ASP.NET中的DataGrid控件又爱又恨.一方面,DataGrids大大简化了在HTML中通过表格中描述数据源,另一方面,DataGrid在服务器端如此重要,导致了大量的页面请求被传回服务器.例如,当用户使用分页DataGrid时,从一个页面转到另一个页面就会导致页面请求传回服务器.这样就会降低系统的性能.毫无疑问,广大开发人员的心愿就是有一种好的DataGrid,能够使包括数据记录的页

  • 一款简洁大气的jquery日期日历插件

    本jquery插件名为manhuaDate,暂时只支持jquery 1.9.0以下版本,比如jquery-1.8.3.min.js 查看效果网址: http://keleyi.com/a/bjad/emf1jc13.htm 示例代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional

  • jQuery 浮动标签插件,帮助你提升表单用户体验

    浮动标签模式(Float Label Pattern)是最新流行的一种表单输入域的内容提示方式,当用户在输入框输入内容的时候,原先占位符的内容向上移动,显示在输入的内容的上面.这里推荐的这款 jQuery 插件就是帮助你实现浮动标签效果. 关于浮动标签模式更详细的内容可以参考这篇文章:<Float Label Pattern>. 您可能感兴趣的相关文章 特别推荐:10套精美的免费网站后台管理系统模板 Parallax.js – 自适应智能设备方向的视差效果插件 Chance – 功能强大的 J

  • jQuery拖拽插件制作拖拽排序特效

    基于jQuery拖拽插件制作拖拽排序特效是一款非常实用的鼠标拖拽布局插件.效果图如下: 在线预览 源码下载 实现的代码. html代码: <h1>水平拖拽</h1> <div class="demo"> <div class="item item1"><span>1</span></div> <div class="item item2"><sp

Tags: