jqGrid在MVC中的版本是已经通过 HtmlHelper 的扩展方法封装后的产物,webForm版本貌似也将其封装成了服务器端空间,所以我推荐下载原生的jqGrid版本的地址为:http://www.trirand.com/blog/?page_id=6

推荐的Demo学习网址为:http://trirand.com/blog/jqgrid/jqgrid.html

Documentation:http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jqgriddocs

jqGrid中的一些概念:

我们调用jqGrid的时候用的语法是:

jQuery("#grid_id").jqGrid(options);

这里的option是一系列的键值对,可以是方法、属性值、事件,其中有些是可选的,有些事必须的,你可以将我下面的demo中的options作为参考。

第一个jqGrid Demo

接收json数据时候的前台代码:   如果要前台要接受xml数据,前台代码请看:http://www.trirand.com/jqgridwiki/doku.php?id=wiki:conventions

<head runat="server"> 
    <meta name="viewport" content="width=device-width" />     <script src="../../Scripts/jquery-1.7.2.min.js"></script> 
    <script src="../../Scripts/jquery-ui-1.8.21.custom.min.js"></script> 
    <script src="../../Scripts/grid.locale-en.js"></script> 
    <script src="../../Scripts/jquery.jqGrid.min.js"></script> <script type="text/javascript"> 
    $(function () { 
        jQuery("#list2").jqGrid({ 
            url: '/Home/ReturnJson', 
            datatype: "json", 
            colNames: ['Name', 'PhoneNo', 'EmailAddress'], 
            colModel: [ 
                { name: 'Name', index: 'Name', width: 55 }, 
                { name: 'PhoneNo', index: 'PhoneNo', width: 90 }, 
                { name: 'EmailAddress', index: 'EmailAddress', width: 100 }, 
            ], 
            sortname: 'Name', 
            autoWidth:false, 
            rowNum: 10, 
            rowList: [10, 20, 30], 
            pager: '#pager2', 
            sortname: 'id', 
            viewrecords: true, 
            autoencode: true, 
            sortorder: "desc", 
            caption: "JSON Example", 
            jsonReader: { 
                repeatitems: false 
            }, 
        }); 
        jQuery("#list2").jqGrid('navGrid', '#pager2', { edit: false, add: false, del: false });     }) 
</script> 
    <title>Index</title> 
</head> 
<body> 
    <div> 
                <table id="list2"></table> 
        <div id="pager2"></div> 
    </div> 
</body> 
</html>    返回json数据的后台代码后台代码:
MVC中返回xml数据时候需要扩展,扩展的方式请看:http://www.cnblogs.com/xfrog/archive/2011/01/06/1929212.html
public ActionResult Second() 

    return View(); 
} public JsonResult ReturnJson(int page,int rows,string search,string sidx,string sord) 

    TestModel[] data = new TestModel[] { 
        new TestModel{id=1,Name="张三", PhoneNo="123", EmailAddress="zhangsan@gmail.com"}, 
        new TestModel{id=2,Name="李四", PhoneNo="456", EmailAddress="lisi@gmail.com"}, 
        new TestModel{id=3,Name="王五", PhoneNo="789", EmailAddress="wangwu@gmail.com"}, 
    }; 
    int currentPage = Convert.ToInt32(page)-1; 
    int totalRecords = data.Length; 
    var totalPages = (int)Math.Ceiling(totalRecords/(float)rows);     var jsonData = new 
    { 
        page=page, 
        total=totalPages, 
        records=totalRecords, 
        rows = data 
    };     return Json(jsonData,JsonRequestBehavior.AllowGet); 

但我们能够成功的run起来我们的demo以后,如果要实现一些特殊的功能,我们可以从demo中进行学习,在文章额考试我们给出了demo的地址。

jqGrid笔记@简单实现的更多相关文章

  1. IIC驱动学习笔记,简单的TSC2007的IIC驱动编写,测试

    IIC驱动学习笔记,简单的TSC2007的IIC驱动编写,测试 目的不是为了编写TSC2007驱动,是为了学习IIC驱动的编写,读一下TSC2007的ADC数据进行练习,, Linux主机驱动和外设驱 ...

  2. 图解HTTP学习笔记——简单的HTTP协议

    简单的HTTP协议 前言 最近在学习Web开发的相关知识,发现<图解HTTP>这本书通俗易懂.所以花时间学习这本书,并记录下学习笔记. 如上图,我们每天都在浏览网页,一般我们都是在浏览器地 ...

  3. Redis设计与实现读书笔记——简单动态字符串

    前言 项目里用到了redis数据结构,不想只是简单的调用api,这里对我的读书笔记做一下记录.原文地址: http://www.redisbook.com/en/latest/internal-dat ...

  4. Verilog学习笔记简单功能实现(二)...............全加器

    先以一位全加器为例:Xi.Yi代表两个加数,Cin是地位进位信号,Cout是向高位的进位信号.列表有:   Xi     Yi    Cin Sum Cout 0 0 0 0 0 0 0 1 1 0 ...

  5. jqgrid笔记

    //重置列表请求url var url = "url?name="+name; $(grid_list_selector).jqGrid('setGridParam',{url:u ...

  6. Verilog学习笔记简单功能实现(八)...............同步FIFO

    Part 1,功能定义: 用16*8 RAM实现一个同步先进先出(FIFO)队列设计.由写使能端控制该数据流的写入FIFO,并由读使能控制FIFO中数据的读出.写入和读出的操作(高电平有效)由时钟的上 ...

  7. Verilog学习笔记简单功能实现(六)...............计数分频电路

    在分频器电路中最重要的概念有两个:1)奇分频/偶分频:2)占空比. A)其中最简单的就是二分频电路,占空比为50%,其Verilog程序为 module half_clk(clr,clk_in,clk ...

  8. Verilog学习笔记简单功能实现(四)...............译码器和编码器

    这里以简单的3-8译码器和8-3编码器为例: module decoder3_8(a,out); :]a; :]out; 'b1<<a;/*把最低位的1左移in位(根据in口输入的值)并赋 ...

  9. JavaScript学习笔记-简单的倒计时跳转页面

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

随机推荐

  1. Windows下配置Mysql

    这里说的配置Mysql,是在安装时进行的,请先查看:Windows平台下安装Mysql 紧接上文,安装完成后将配置选项打上对勾,按下“Finish”,出现下面的界面,这里有一个很好的功能,mysql配 ...

  2. AOP(转)

    AOP是什么?AOP(Aspect-Oriented Programming),面向切面编程,看着是跟OOP(面向对象编程)挺相近的,但实际上又有什么区别呢?OOP具有封装,继承,多态等东西来定义从上 ...

  3. Shell中的正则表达式及字符串处理

    shell里一个正则表达式就是由普通字符(例如字符 a 到 z)以及特殊字符(称为元字符)组成的文字模式.该模式描述在查找文字主体时待匹配的一个或多个字符串.正则表达式作为一个模板,将某个字符模式与所 ...

  4. 复习知识点:GCD多线程

    GCD的基础 #pragma mark - 使用GCD 创建一个 串行 队列 // 第一种:系统提供的创建串行队列的方法 // 在真正的开发中如果需要创建串行队列,比较习惯用这种 // dispatc ...

  5. iOS中的图像处理(一)——基础滤镜

    最近在稍微做一些整理,翻起这部分的代码,发现是两个多月前的了. 这里讨论的是基于RGBA模型下的图像处理,即将变换作用在每个像素上. 代码是以UIImage的category形式存在的: typede ...

  6. 【OpenMesh】使用网格的属性和特征

    例子主要展示如何改变位置,法向量,颜色和纹理的数据类型. 在之前的指南中我们学习使用标准属性,通过调用适合的请求方法.不像自定义属性,用户通过传递数据类型到句柄来指定数据类型(比如,MyMesh::F ...

  7. [Swust OJ 404]--最小代价树(动态规划)

    题目链接:http://acm.swust.edu.cn/problem/code/745255/ Time limit(ms): 1000 Memory limit(kb): 65535   Des ...

  8. 复习C语言系列二:动态调用函数指针数组

    a:用call_fun_ptr调用afun(),b:用call_fun_ptr调用bfun() a 请输入给您指定的函数输调用的参数 afun_par ------------------------ ...

  9. jquery的slideUp、slideDown、slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug

    jquery的slideUp.slideDown.slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug: 1. 因position引起的问题 影响:IE全系列 症状:在需要sl ...

  10. 网络编程(UDP协议-聊天程序)

    网络编程中的UDP协议中聊天程序,发送端口,和接受端口. 发送端口(Send): <span style="font-size:18px;">package cn.it ...