求一EXTJS 的grid控件绑定后台dt简单例子

.NET技术 > ASP.NET
收藏 回复
[问题点数：200分，结帖人lonestar555]
更多帖子
私信 空间 博客
长江
等级
本版专家分：2875
结帖率 100%
自己摸了两天还是没搞出来。
求一例子：
用VS2010的MVC建的项目，EXTJS 4.0 中的GRID控件从后台DataTable中取数据

例子最好简单点两三个字段就行了!谢谢！
只看楼主 引用 举报 楼主 收起
展开阅读全文
更多帖子
私信 空间 博客
csdn_aspnet
等级
本版专家分：13829
参考：http://blog.csdn.net/linkyou/article/details/6586387
只看TA 引用 举报 #1得分 40
更多帖子
私信 空间 博客
paul_its
等级
本版专家分：108
var cm = new Ext.grid.ColumnModel([
    new Ext.grid.RowNumberer(),
    { header: '单位代码', dataIndex: 'UnitId', sortable: true, hidden: true },
    { header: '单位代码', dataIndex: 'TypeCode', sortable: true, width: 100 },
    { header: '单位名称', dataIndex: 'UnitNAME', sortable: true, width: 110 }
      ]);
var store = new Ext.data.Store({
   proxy: new Ext.data.HttpProxy({ url: 'UnitList.aspx?cmd=list' }),//你请求数据的路径
   reader: new Ext.data.JsonReader({ totalProperty: 'totalProperty', root: 'root' },
                [
                    { name: 'UnitId' },
                    { name: 'TypeCode' },
                    { name: 'UnitNAME' }
                ]
           ),
    });

    var grid = new Ext.grid.GridPanel({
        store: store,
        cm: cm,
        renderTo: Ext.getBody(),
        border: false,
        stripeRows: true,
        loadMask: true,
        frame: false,
        autoHeight: true,
        viewConfig: { forceFit: true },
        monitorResize: true,
        listeners:
        {
          "rowdblclick": function (grid, rowIndex, e) {
            alert("行双击事件!");                  }
        }
    });
  store.load();
------------------华丽的分割线-------------------- 
if (Request.QueryString["cmd"].Equals("list"))
{
  #region 获取数据               
  IList<FDNE_UNIT_Entity> list =new Unit_BLL().GetUnitList();//获取数据返回泛型集合
  StringBuilder str = new StringBuilder();
  str.Append("{totalProperty:" + list.Count + ",root:[");
  if (list == null || list.Count == 0)
  {
      str.Append("]}");
      Response.Write(str.ToString());
      return;
  }
  for (int i = 0; i < list.Count; i++)
  {
      str.Append("{TypeCode:'" + list[i].Unitcode + "',UnitNAME:'" + list[i].Unitname + "',UnitId:'" + list[i].Unitid + "'}");
      if (i < (list.Count) - 1)
          str.Append(",");
  }
  str.Append("]}");
  Response.Write(str.ToString());
  Response.End();
  #endregion
}

你要的是从后台DataTable中取数据，我这是从集合中取都只需循环即可。希望你懂得......
只看TA 引用 举报 #2得分 50
更多帖子
私信 空间 博客
长江
等级
本版专家分：2875
这是原来带有的例子,数据源是url: 'http://www.sencha.com/forum/remote_topics/index.php',
可以正常显示数据，
 


 var store = Ext.create('Ext.data.Store', {

        id: 'store',

        pageSize: 200,

        model: 'ForumThread',

        remoteSort: true,

        // allow the grid to interact with the paging scroller by buffering

        buffered: true,

        proxy: {

            // load using script tags for cross domain, if the data in on the same domain as

            // this page, an HttpProxy would be better

            

            type: 'jsonp',

           url: 'http://www.sencha.com/forum/remote_topics/index.php',

            extraParams: {

                total: 50000

            },

            reader: {

                root: 'topics',

                totalProperty: 'totalCount'

            },

            // sends single sort as multi parameter

            simpleSortMode: true

        },

        sorters: [{

            property: 'lastpost',

            direction: 'DESC'

        }]

    }); 

但是我改成我的'Handler2.ashx'之后怎么搞都没数据出来


 url: 'Handler2.ashx',


Handler2.ashx里换了N种写法JS都没收到数据


       public void ProcessRequest(HttpContext context)

        {

           string str = "{\"totalCount\":\"1\",\"topics\":[{\"title\":\"XTemplate with in EditorGridPanel\",\"threadid\":\"133690\",\"username\":\"kpr@emco\",\"userid\":\"272497\",\"dateline\":\"1305604761\",\"postid\":\"602876\",\"forumtitle\":\"Ext 3.x: Help\",\"forumid\":\"40\",\"replycount\":\"2\",\"lastpost\":\"1305857807\",\"excerpt\":\"\"}]}";

            context.Response.Write(str);

        }


郁闷啊！！！
只看TA 引用 举报 #3得分 0
更多帖子
私信 空间 博客
长江
等级
本版专家分：2875
引用 2 楼 vanceinfo_zhao 的回复:
var cm = new Ext.grid.ColumnModel([
  new Ext.grid.RowNumberer(),
  { header: '单位代码', dataIndex: 'UnitId', sortable: true, hidden: true },
  { header: '单位代码', dataIndex: 'TypeCode', sortable: true,……


运行到第一句就报错“缺少对象”~！
只看TA 引用 举报 #4得分 0
更多帖子
私信 空间 博客
长江
等级
本版专家分：2875
引用 1 楼 hefeng_aspnet 的回复:
参考：http://blog.csdn.net/linkyou/article/details/6586387


没看到有后台传数据
只看TA 引用 举报 #5得分 0
更多帖子
私信 空间 博客
阿非
等级
本版专家分：157029
勋章
Blank
金牌 2011年12月 总版技术专家分月排行榜第一
2011年11月 总版技术专家分月排行榜第一
Blank
红花 2012年1月 .NET技术大版内专家分月排行榜第一
2011年12月 .NET技术大版内专家分月排行榜第一
2011年11月 .NET技术大版内专家分月排行榜第一
2008年3月 .NET技术大版内专家分月排行榜第一
Blank
黄花 2010年4月 .NET技术大版内专家分月排行榜第二
2008年2月 .NET技术大版内专家分月排行榜第二
Blank
蓝花 2010年3月 .NET技术大版内专家分月排行榜第三
2009年12月 .NET技术大版内专家分月排行榜第三
2009年4月 .NET技术大版内专家分月排行榜第三
mvc 还是 webform
只看TA 引用 举报 #6得分 10
私信 空间 博客
jshi123
等级
本版专家分：69678
勋章
Blank
黄花 2013年9月 .NET技术大版内专家分月排行榜第二
Blank
蓝花 2013年8月 .NET技术大版内专家分月排行榜第三
2011年10月 .NET技术大版内专家分月排行榜第三 


	public void ProcessRequest(HttpContext context)

	{

		string str = "{\"totalCount\":\"1\",\"topics\":[{\"title\":\"XTemplate with in EditorGridPanel\",\"threadid\":\"133690\",\"username\":\"kpr@emco\",\"userid\":\"272497\",\"dateline\":\"1305604761\",\"postid\":\"602876\",\"forumtitle\":\"Ext 3.x: Help\",\"forumid\":\"40\",\"replycount\":\"2\",\"lastpost\":\"1305857807\",\"excerpt\":\"\"}]}";

		str = context.Request["callback"] + "(" + str + ")";

		context.Response.Write(str);

	}
只看TA 引用 举报 #7得分 100
更多帖子
私信 空间 博客
长江
等级
本版专家分：2875
自己搞定了
http://blog.csdn.net/lonestar555/article/details/6979498

只看TA 引用 举报 #8得分 0
私信 空间 博客
IT民工010
等级
本版专家分：0
  drfv
[align=center]wer[align=right]wer
[/align][/align]
只看TA 引用 举报 #9得分 0
收起
收藏 回复
长江

等级：

关注 私信 TA的帖子
一个完整的extjs的GridPanel例子

ExtJS中的表格功能非常强大，包括了排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等实用功能。...呵呵，为了帮助大家解决ExtJS的这些小麻烦，许老师做了下面的一个小DEMO来演示Grid

ExtJS4中GridPanel组件简单例子

Ext.onReady(function(){  var data = [  ['张三','中国银行',27],  ['李四','工商银行',29],  ['王五','北京银行',30]  ];... var mystore = new Ext.data.ArrayStore({ ... fields

ExtJs GridPanel 完整实例

页面效果如下   view plaincopy to clipboardprint?&lt;mce:script type="text/javascript"...-- Ext.onReady(function(){ //初始化Extjs Ext.QuickTips.init(); Ext.BLANK_IMAGE_UR...

EXTJS 中Grid控件的常用代码

1、定义列  var cm = new ExtgridColumnModel([  {header:编号,dataIndex:id},  {header:名称,dataIndex:name},  {header:描述,dataIndex:descn}  ]); 2、数据源 ... var data

EXTJS 4.2 资料 控件之Grid Columns 列renderer 绑定事件

columns: [ { header: '序号', xtype: 'rownumberer', align: 'center', width: 100 }, { header: 'CompanyId', dataIndex: 'CompanyId', width: 100, hidden: tru...

Extjs初学入门，详细panel、form、grid等介绍

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.Container.AbstractContainer  Ext.container.Container  

Extjs初学入门，详细panel、form、grid等介绍

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.container.AbstractContainer  Ext.container.Container  

ExtJs之GridPanel篇

从今天开始一起来探讨一些关于Ext的高级知识（其实也不算什么高级知识，只是相对前面的静态的东西来说从今天起会更多的说一些动态方面的内容）。 Ext中GridPanel和TreePanel都是常用的组件，被大量使用在Ext开发...

extjs初学者教程

extjs初学者教程 标签： extjs 2015-05-27 15:35 522人阅读 评论(0) 收藏 举报 分类： ExtJS（32） layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Co

extjs初学者教程

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.container.AbstractContainer  Ext.container.Container  

ExtJS-入门（转载自http://www.blogjava.net/puras/archive）

而且它也可能是你学习ExtJS所接触的第一个方法,这个方法在当前的DOM加载完毕后自动调用,保证页面内的所有元素都能被Script所引用.可以尝 试在这个方法中添加一条语句,看看页面打开后是什么反映: <br /> Ext....

ExtJs之GridPanel篇

前面写了几篇关于Ext基本知识的文章，估计大家都看烦了，但是个人认为对于初学者还是有些用的。从今天开始一起来探讨一些关于Ext的...大家都知道GridPanel是用来显示数据的，这里我会结合实际的开发做一个简单的demo来

VS2005中使用Extjs GridPanel(1)

由于本人对Extjs尚处于初期学习阶段 只为遇到同样开发困难的朋友一些开发建议 欢迎高手们不吝赐教。 Extjs是一个很不错的JS开源框架,如果你不知道Extjs是什么,那得先去看看它的官方网站 http://extjs.com/ 其中很...

extjs初学者教程

1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.container.AbstractContainer  Ext.container.Container  

extjs初学者教程

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.container.AbstractContainer  Ext.container.Container  

extjs初学者教程

layout 1.面板  (1)类结构  Ext.Base  Ext.AbstractComponent  Ext.Component  Ext.container.AbstractContainer  Ext.container.Container  

VS2005中使用Extjs GridPanel(1)

Extjs是一个很不错的JS开源框架,如果你不知道Extjs是什么,那得先去看看它的官方网站 http://extjs.com/ 其中很引人瞩目的就是他的Gird控件 丰富的功能和友好的界面 是实现企业内部系统非常好的解决方案,但由于其...

VS2005中使用Extjs GridPanel(1)

Extjs是一个很不错的JS开源框架,如果你不知道Extjs是什么,那得先去看看它的官方网站 http://extjs.com/ 其中很引人瞩目的就是他的Gird控件 丰富的功能和友好的界面 是实现企业内部系统非常好的解决方案,但由于其...

那些年我准备的前端面试题

commonJS相关： (1)在commonJS规范中，require,exports,module，__filename,__dirname都是通过动态编译后添加到模块的...而且必须弄清楚一点：exports是一个对象，如果重新赋值，那么不会反映到外面，但是module.expo

那些年我准备的前端面试题集合

浏览器从服务端获取网页后会根据文档的DOCTYPE定义显示网页，如果文档正确定义了DOCTYPE浏览器则会进入标准模式（Standards Mode），否则浏览器会进入怪异模式或混杂模式（Quirks mode）。

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！ 话说三石官网加实例了，http://fineui.com/demo/#/demo/grid/grid_rowexpander_grid.aspx 是用extjs写的，我写的...

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！ 话说三石官网加实例了，http://fineui.com/demo/#/demo/grid/grid_rowexpander_grid.aspx 是用extjs写的，我写的...

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

ASP.NET-FineUI开发实践-10

嵌套Grid，光棍月大放送，不藏着掖着。实在写的不好，没脸藏啊~只考虑显示排序修改什么的都不管！...2.一个下拉生成一个Grid，后台生成到前台我不会，前台用ExtJs生成太复杂，要写好多的ExtJs原生。 3.结合以上两点大

WinForm轻松实现自定义分页

做web的时候，我习惯了Extjs的Grid分页效果，所以也想在WinForm中做个类似的效果，所以咬咬牙，做个山寨版本的吧，虽然自己写费时费力，在项目进度考虑中不是很可取，但是还是特别想山寨一回，做自己喜欢的风

winform中DataGridView实现分页功能

WinForm轻松实现自定义分页 （转载） WinForm轻松实现自定义分页 （转载） ...以前都是做web开发，最近接触了下WinForm，发现WinForm分页控件好像都没有，网上搜索了一下，发现有很多网友写的分页控件，分页效果应...

相关热词 c#线程池类 c#如何遍历容器 c#16进制加法 c#事件订 c# linq xml c# udp 多个客户端 c# 程序应注意事项 c# json 接口开发 c# 按行txt c#怎么扫条形码