`

ext的GridPanel处理复合主键时只显示一条记录

    博客分类:
  • ext
 
阅读更多

看了好多文章,

 

解决方法一:GridPanel增加属性

autoHeight:true

可惜,失败了。

 

 

 

 

解决方法二(最终方案):

 

后台返回的数据有多条,分页栏PagingToolbar显示的记录总数也正确,可是当前显示第xx-xx条记录却始终都是显示第1-1条记录,gridpanel却只显示当前页的最后一条记录。

于是到网络上去搜相关信息,说是主键重复,只要主键不同就可以正常显示了。

原文如下:

 写道
解决:服务端返回的数据中每一条记录的id都是相同的,而JsonReader的idProperty默认配置是id,这就是出现问题的根源。你只要让每一条记录的id不同就行了。

 

 写道
这应该是Ext对json处理机制导致的问题,id这个名称可能是默认的主键,所以当这个字段相同的时候就视为相同数据,导致只显示一条,以后可以考虑主键字段不叫id(改写JSONReader的idProperty)或者保证id这个字段不重复

 

写道

reader数据源中的id是一样的值,如果id是相同的值,则ext的stroe会自动的过滤掉,则需将id:"属性值",去掉。

 

可惜,回头再去检查,可是发现json数据中的id字段没有重复,我的是复合主键。

firebug查看后台返回的数据,如下:

{
"data":
[
{"count":"4","endTime":"2012-10-17 10:59:00",
"id":{"stepNo":"1","workdate":"20121012"},
"info":"2012-10-17 10:40:00:步骤一成功","result":"0","startTime":"2012-10-17 10:59:00","stepName":"step1"},

{"count":"4","endTime":"2012-10-17 10:59:00",
"id":{"stepNo":"4","workdate":"20121012"},
"info":"2012-10-17 10:40:00:步骤二成功","result":"0","startTime":"2012-10-17 10:59:00","stepName":"step2"},

{"count":"4","endTime":"2012-10-17 10:59:00",
"id":{"stepNo":"5","workdate":"20121012"},
"info":"2012-10-17 10:40:00:步骤三成功","result":"0","startTime":"2012-10-17 10:59:00","stepName":"step3"}
],
"totalCount":3}
 

 


最终,解决如下:

 

 var gridStore = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: url.query
        }),
        reader: new Ext.data.JsonReader({
            root: 'data',
            totalProperty: 'totalCount',
            idProperty:'workdate'+'stepNo'   //最关键的一句话
        }, [{
            name: 'workdate',
            mapping: 'id.workdate'
        }, {
            name: 'stepNo',
            mapping: 'id.stepNo'
        }, {
            name: 'stepName',
            mapping: 'stepName'
        }, {
            name: 'startTime',
            mapping: 'startTime'
        }, {
            name: 'endTime',
            mapping: 'endTime'
        }, {
            name: 'result',
            mapping: 'result'
        }, {
            name: 'count',
            mapping: 'count'
        }, {
            name: 'info',
            mapping: 'info'
        }])
    });

 

 

 

 

 

分享到:
评论
2 楼 Veer-273 2015-06-05  
谢谢 非常有用!
1 楼 hello_world_wdq 2014-04-08  
谢谢,有用

相关推荐

    Ext GridPanel 中实现加链接操作

    Ext GridPanel 主要有以下几个组成部分: 1. **Store**:存储数据的模型。 2. **Column Model**:定义列的信息。 3. **View**:显示数据的视图。 4. **Selection Model**:处理选中行的逻辑。 5. **Renderer**:...

    EXT GridPanel获取某一单元格的值

    在EXT GridPanel中,获取某一单元格的值是常见的操作,特别是在实现自定义事件处理或数据验证时。 在提供的代码段中,我们看到一个监听`cellclick`事件的例子,这是EXT GridPanel中用于捕获用户点击单元格时的事件...

    ext gridpanel 跨行

    "ext gridpanel 跨行"这个主题主要涉及到在GridPanel中实现单元格或行的跨行显示,这在展示复杂数据或需要组合信息时非常有用。 首先,让我们深入理解什么是GridPanel。在Ext JS中,GridPanel是一个表格视图,它...

    Ext的gridpanel控件二次加载问题

    通常,这可能是由于在重新加载时,没有正确地处理GridPanel实例或者数据源,导致旧的实例被覆盖或者销毁,新的数据未能正确显示。在某些情况下,可能是由于页面刷新或者重定向导致GridPanel的DOM元素被清除,从而...

    Ext GridPanel导出Excel(改进)

    将页面的GridPanel中的数据导出到Excel中 测试Ext:版本2.2.1 支持GridSummary,GroupSummary和GroupHeaderPlugin插件 使用方法: 1)把三个JS文件引入到页面中 2)调用例句: var data2Excel = new Ext.icss.Data2...

    ext.net 动态创建gridpanel

    GridPanel 是 ExtJS(Ext.NET 的基础)中的一个重要组件,用于展示数据表格。在这个场景中,我们将深入探讨如何使用Ext.NET代码动态创建GridPanel,并在各种窗口中灵活展示。 1. **动态创建GridPanel**: 在Ext...

    Ext.grid.GridPanel 删除线

    Ext.grid.GridPanel 删除线 放到example文件夹下运行

    Ext实现GridPanel内嵌行内嵌表格(RowExpander)

    在标准的GridPanel中,每一行通常只显示简化的数据,但有时我们需要在点击一行时显示更详细的信息。这就是RowExpander的作用,它在每行前面添加一个可折叠的图标,用户点击后会展开一行,展示内部的详细信息,通常以...

    EXTJSEXT实例GridPanel.

    首先,创建一个GridPanel需要定义以下主要部分: 1. **Store**: Store是用来存储数据的,它可以是从服务器获取的数据,也可以是静态定义的数组。在EXTJS中,你需要定义fields来指定数据结构,并通过loadData或配置...

    Ext.grid.GridPanel属性祥解

    #### 一、Ext.grid.GridPanel概述 `Ext.grid.GridPanel`是ExtJS中用于展示表格数据的核心组件之一。它提供了丰富的配置选项和方法来帮助开发者灵活地控制表格的表现形式及功能。对于初学者或者希望深入理解`...

    ext.net gridpanel 弹出窗

    ext.net gridpanel 弹出窗

    Ext GridPanel加载完数据后进行操作示例代码

    在Ext JS中,`Ext GridPanel`是一种常用的组件,用于展示和操作表格数据。它具有丰富的功能,包括分页、排序、筛选等。本示例主要关注在`GridPanel`加载完数据后如何进行特定的操作,特别是选定某些行数据。 首先,...

    Ext2.2.GridPanel分页处理+dwrproxy(js对象和json两种数据)

    在IT行业中,分页处理是Web应用程序中一个非常重要的功能,特别是在处理大量数据时,它能够提高用户体验并减轻服务器负担。本话题将深入探讨如何在Ext2.2中使用GridPanel进行分页处理,并结合DWR(Direct Web ...

    Ext.grid.ColumnModel显示不正常

    Ext.grid.ColumnModel显示不正常

    ext form gridpanel

    "Ext Form GridPanel"是Ext JS库中的一个重要组件,它结合了表格(Grid)和表单(Form)的功能,提供了一种强大而灵活的方式来显示和编辑数据。在Web应用程序开发中,这种组件常用于数据录入和展示,尤其适用于处理...

    ExtJS 表格面板GridPanel完整例子

    在这个例子中,我们创建了一个名为"MyApp"的应用,并在启动时创建了一个数据存储(store),包含了两个记录。然后,我们创建了一个GridPanel,设置了标题、数据源(store)、列配置(columns)和尺寸。最后,我们将...

    ext gridpanel多层表头分组小计导出excel与Java后台交互全代码

    该例子实现了ext的gridpanel多层表头+分组+小计以及与Java后台交互的全代码。还有自适应浏览器大小的功能包括导出excel,里面有注释,可能注释不全。分别为group.jsp,totals.jsp页面。

    tapestry4.02中封装ext的GridPanel组件

    在Tapestry 4.02中封装Ext的GridPanel组件,意味着开发者将ExtJS的GridPanel功能集成到Tapestry应用中,使Tapestry应用能够利用GridPanel的强大功能。这个过程通常涉及到以下几个关键步骤: 1. **引入ExtJS库**:...

    Ext.net实现GridPanel拖动行、上移下移排序功能DEMO

    对于GridPanel中拖动选中行排序的实现,网上有不少ExtJs实现的例子,但是没有找到使用Ext.net实现的,正好最近有个需求要使用,干脆来写一个。 DEMO功能说明: 1、拖动GridPanel选中行到新位置排序。 2、在拖动结束...

    ext2.0网格实践源码

    EXT GridPanel是EXT库中的一个核心组件,它用于显示二维的数据表格。这个组件具有高度可定制性,支持排序、分页、过滤、行编辑等多种功能。EXT2.0版本虽然相对较旧,但对于理解EXT的基础架构和工作原理仍然是有价值...

Global site tag (gtag.js) - Google Analytics