`
zoushaohua84
  • 浏览: 10044 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

GridPanel中添加动态列

阅读更多

//根据传入时间参数,动态添加列var sd=params.sTime;
   var ed=params.eTime;

   var sy=sd.substr(0,4);
   var ey=ed.substr(0,4);
   
   var sm=Number(sd.substr(5,7));
   var em=Number(ed.substr(5,7));
   
   var count=12*(ey-sy)+(em-sm)+1;
   
   var dates=[];  
   
   var colModelTem =new Ext.grid.ColumnModel([
                   new Ext.grid.RowNumberer(),
                   new Ext.grid.CheckboxSelectionModel(),
      {
                    header : "往来单位",
     dataIndex : 'customerAll',
     sortable : true,
     width: 200,
     align : 'left'
                   },{
                    header : "合计",
              dataIndex : 'totalMoney',
              sortable : true,
              align : 'left'
                   },{
                    header : "多开发票金额",
     dataIndex : 'invoicedMoney',
     sortable : true,
     align : 'left'
               }
                ]);
   
   var fields = ['customerAll','totalMoney','invoicedMoney'];
   
   //往数组里添加日期
   for(var i=0;i<count;i++){
    var months=parseInt(sm+i);
    if(months>12){
     var year=parseInt((sm+i)/12);
     var month=parseInt((sm+i)%12);
     dates[i]=(sy+year)+'-'+month;
     colModelTem.addColumn(dates[i],3+i);
     fields.push(dates[i]);
    }else{
     dates[i]=sy+"-"+months;
     colModelTem.addColumn(dates[i],3+i);
     fields.push(dates[i]);
    }
   }  
    //var json = this.getJsonDate(params);

    var storeTem  = new Ext.data.JsonStore({
     autoLoad : true,
     url : 'viewUnInvoiceSummaryItem',
     remoteSort : true,
     root : 'json.data',
     totalProperty : 'json.totalCount',
     fields : fields,
     sortInfo : {
      field : 'id',
      direction : 'DESC'
       },
       baseParams : {
       start : 0,
       limit : commonPageSize,
       customerAll : params.customerAll,
                   sTime : params.sTime,
                   eTime : params.eTime 
     }
        });
    this.reconfigure(storeTem,colModelTem);

分享到:
评论

相关推荐

    Ext GridPanel 中实现加链接操作

    #### 二、在 GridPanel 中添加链接 为了在 Ext GridPanel 的单元格中添加可点击的链接,我们需要使用 `renderer` 函数来定制单元格的内容。具体步骤如下: 1. **创建 GridPanel**: ```javascript var store = ...

    ext.net 动态创建gridpanel

    总的来说,`newtpanel.aspx` 和 `newtpanel.aspx.cs` 文件展示了如何利用Ext.NET在服务器端和客户端代码中动态创建和管理GridPanel,以及如何将它们集成到各种窗口容器中,以实现灵活的数据展示和交互。这是一项关键...

    给Extjs的GridPanel增加“合计”行

    总结来说,EXTJS的GridPanel添加“合计”行涉及到View的自定义、数据计算、模板创建、DOM操作以及样式调整等多个环节。通过以上步骤,我们可以实现一个动态更新且具有美观样式的“合计”行。这不仅增强了数据展示的...

    Gridpanel多表头的扩展

    标题"Gridpanel多表头的扩展"正是针对这一需求,它允许我们在Gridpanel中创建多级列标题,以便更好地组织和理解数据。 多表头在EXTJS 2.2版本中被引入,提供了更灵活的列结构,允许用户将列分为多个层次,每个层次...

    EXTJSEXT实例GridPanel.

    这个实例"EXTJSEXT实例GridPanel"旨在教授如何在EXTJS中创建并使用GridPanel。 GridPanel是EXTJS中的一个核心组件,它允许开发者以网格形式展示数据,支持多种功能,如排序、分页、筛选、编辑等。在EXTJS中,...

    Extjs中的GridPanel

    用户可以添加、编辑和删除 GridPanel 中的数据行。通过配置编辑器(editors)和工具栏(toolbar)可以实现这些操作。 7. **行选择模式**: GridPanel 支持多种行选择模式,如单选、多选和全选。配合 ...

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

    RowExpander插件是ExtJS中一个非常有用的特性,允许我们在GridPanel的每一行中添加一个可展开的区域,展示更多的详细信息。 首先,我们来理解RowExpander的基本概念。在标准的GridPanel中,每一行通常只显示简化的...

    Extjs入门教程(treePanel和GridPanel)

    2. 创建GridPanel:定义Grid的数据模型,设置列配置,添加行操作和列筛选。 3. 数据绑定:通过store将TreePanel和GridPanel连接起来,使得选择树节点可以动态改变Grid的数据。 4. 事件监听:添加事件监听器来响应...

    gridPanel添加按钮

    2. **Columns** - 定义显示在网格列中的字段。 3. **Model** - 数据字段的定义,与Store中的数据进行映射。 4. **Selection Model** - 确定用户可以如何选择行以及选择行为如何影响其他组件。 5. **Plugins** 和 **...

    ExtJs GridPanel双击事件获得双击的行

    接下来,我们需要为GridPanel添加双击事件监听器。在ExtJs中,我们可以使用`viewConfig`配置项中的`selType`来定义选择模型,通常是'checkboxmodel',以便在每行前添加复选框。然后通过`selModel`配置项设置双击时...

    extjs动态生成表格,前台+后台

    当请求成功时,`success`回调函数被调用,这里我们解析返回的JSON响应,将每一列的数据字段和标题添加到ColumnModel中。然后,调用`makeGrid`函数来实际创建并渲染GridPanel。 `makeGrid`函数是实现动态生成...

    tapestry4.02中封装ext的GridPanel组件

    在IT行业中,Web开发是一个重要的领域,而Tapestry和ExtJS是两个广泛使用的框架,它们各自在构建动态和交互式的Web应用上有着独特的优点。本文将深入探讨Tapestry 4.02版本中对ExtJS的GridPanel组件进行封装的相关...

    改变gridpanel的行颜色

    当数据被加载到GridPanel中时,我们可以通过定义特定的CSS类并结合renderer函数来改变特定列的背景颜色。以下是一个示例: ```javascript // 定义一个样式(以红色背景为例) .x-grid-back-red { background: #FF...

    ExtJS 表格面板GridPanel完整例子

    - **排序与过滤**: `sortable`属性允许列排序,而`filter`配置则用于添加过滤器。 - **行编辑**: 使用`RowEditor`插件实现行内编辑。 - **行选择**: 可以配置`selModel`来实现单选或多选行。 - **扩展功能**: 如`...

    ExtJS4.0下的gridPanel组建完全版

    Columns可以通过`xtype`属性设置不同类型的列,如文本列、数字列、日期列等,还可以添加自定义渲染函数来实现特定的数据显示效果。 4. **View**:View是GridPanel的视图层,负责将Store中的数据渲染到页面上。它...

    ExtJS介绍以及GridPanel

    5. 渲染GridPanel:将GridPanel添加到容器中,完成渲染。 在实际应用中,GridPanel还可以与其他组件结合,比如使用Toolbar提供操作按钮,或者嵌入其他复杂的组件,如Charts,以实现数据分析和可视化。 除了...

    汇总Extjs中GridPanel的各个属性与方法.doc.docx

    这两个属性分别表示单元格所在的行索引和列索引,它们用于定位 GridPanel 中的特定单元格。 8. **store**: 除了作为配置项外,`store` 也可以作为一个属性来访问,它提供了操作数据集的方法,如添加、删除、更新...

    Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法

    解决这个问题的方法是在列定义中添加一个名为`hideable`的属性,并将其设置为`false`。这样,即使列被隐藏,也不会在列菜单中出现。以下是一个具体的代码示例: ```javascript { header: "attendanceId", ...

    Extjs4 GridPanel 的几种样式使用介绍

    接下来,我们讨论一下GridPanel中的不同列类型。在实际应用中,我们可能需要处理不同类型的数据显示,例如: 1. **行号列**: 使用`Ext.grid.RowNumberer`,它可以自动为每一行生成序号。 2. **布尔值列**: 对于`...

    Extjs2.02 Gridpanel

    尽管EXTJS GridPanel功能强大,但也有其局限性,比如在EXTJS 2.02版本中可能不支持列锁定和默认的统计功能,也不直接支持数据导出为Excel或PDF格式。然而,随着EXTJS版本的迭代,这些问题在后续版本中得到了改进。 ...

Global site tag (gtag.js) - Google Analytics