`

ExtJs GridPanel展示Java返回的Date类型数据

阅读更多
后台Java返回时间对象格式:
"lastLoginTime":{"date":4,"day":3,"hours":12,"minutes":0,"month":6,"seconds":0,
   "time":1341374400000,"timezoneOffset":-480,"year":112}

前台处理:
ColumnModel中处理:
{header: "最后登录时间", sortable: true,
      renderer : Ext.util.Format.dateRenderer('Y-m-d H:i:s'),
      dataIndex: 'lastLoginTime'}

JsonStore中处理(注意加粗部分):
fields : ['depId','depName',{
name:'lastLoginTime',
type:'date',
mapping : 'lastLoginTime.time',
dateFormat : 'time'
},'mail','password','phone','status','userId', 'userName']
还需要注意一点,这个fields必须顺序匹配,如果没有特殊处理时间就不需要,现在特殊处理时间后,加了mapping,其他的就不知道怎么对应了,所以默认是按照返回的json顺序来,这里要对应。

但是当Java返回的Date为NULL值得时候,你会发现GridPanel压根就不显示数据了,解决办法如下(使用convert):

JsonStore中处理:
fields : ['depId','depName',{
name:'lastLoginTime',
type:'date',
mapping : 'lastLoginTime',
convert : function(v,f){
if(v == null){
return '';
}
var dt = new Date();
dt.setTime(v.time);
return Ext.util.Format.date(dt,'Y-m-d H:i:s');
},
// mapping : 'lastLoginTime.time',
dateFormat : 'time',
defaultValue : ''
},'mail','password','phone','status','userId', 'userName']
而ColumModel中就不需要特殊处理了,如下:
{header: "最后登录时间", sortable: true,dataIndex: 'lastLoginTime'}
1
0
分享到:
评论

相关推荐

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

    在ExtJs中,GridPanel是用于展示数据的常用组件,它可以提供丰富的功能,如排序、分页、筛选等。在实际应用中,我们经常需要监听用户的交互行为,比如双击行进行进一步的操作。本篇文章将深入讲解如何在ExtJs ...

    EXTJS_GridPanel_ColumnModel_列的宽度随数据变化而变化

    EXTJS的GridPanel是其组件库中的核心组件之一,用于展示数据网格,广泛应用于Web应用的数据展示。在EXTJS中,ColumnModel是用来定义GridPanel列结构和行为的关键部分。这篇博客"EXTJS_GridPanel_ColumnModel_列的...

    ExtJs GridPanel延时加载.rar

    GridPanel是ExtJs中一个非常重要的组件,它用于展示表格数据,而延时加载则是一种优化大量数据处理的技术,可以显著提高用户界面的响应速度。 1. **ExtJs GridPanel**: GridPanel是ExtJs中的核心组件之一,它提供...

    给Extjs的GridPanel增加“合计”行

    在EXTJS中,GridPanel是一种常用的组件,用于展示表格数据。在实际应用中,我们经常需要在GridPanel底部显示一行“合计”行,以便对某一列或多列的数据进行求和或其他统计操作。这篇博文“给Extjs的GridPanel增加...

    通过Servlet让Extjs GridPanel 显示数据库数据.docx

    接下来,在HTML页面中使用Extjs GridPanel组件来展示数据。 ```html <!DOCTYPE html> 后台登陆页面 <!-- 引入Extjs CSS和JS文件 --> <script type="text/javascript" src="path/to/ext-base.js"></script>...

    extjs gridpanel例子和简单应用

    通过以上分析可以看出,在ExtJS中利用`GridPanel`展示数据时,需要通过多个对象进行配合来完成数据的加载、解析、展示等功能。这些对象包括`HttpProxy`、`JsonReader`、`Store`、`ColumnModel`和`PagingToolbar`等。...

    ExtJS的GridPanel导出excel文件

    ExtJS的GridPanel导出excel文件,方便快捷易懂!

    Extjs2.02 Gridpanel

    总的来说,EXTJS 2.02 GridPanel是一个功能丰富的表格组件,适用于构建交互性强、数据展示复杂的Web应用。对于开发者而言,掌握EXTJS GridPanel的使用,不仅可以提高开发效率,还能为用户提供优秀的用户体验。

    Extjs分页使用java实现数据库数据查询.docx

    `GridPanel`是ExtJS中的表格组件,用于展示数据。`store`属性绑定到之前创建的`Store`,`columns`定义了列的配置,如`header`(列标题)、`width`(宽度)、`sortable`(是否可排序)和`dataIndex`(对应数据字段)...

    Extjs让Gridpanel组件自动滚屏

    后来公司让改变一个Gridpanel的展现方式,要求实现滚屏的效果。于是我就开始找API相关的功能了。找了很久,也没有找到框架的相应控制方法,然后在网上找了很久,也没有找到有人给去示例,无奈就只能自己写JS来控制...

    Extjs入门教程(treePanel和GridPanel)

    GridPanel则是ExtJS中的表格视图组件,它可以展示大量的数据,并提供排序、筛选、分页等功能。在集成TreePanel和GridPanel时,可能涉及到的概念有:将TreePanel的节点与GridPanel的数据关联,实现点击树节点时动态...

    ExtJs GridPanel 操作

    ExtJS GridPanel是Sencha ExtJS框架中的一个核心组件,用于创建数据网格,展示大量结构化数据。在本文中,我们将深入探讨GridPanel的操作,包括其功能、配置选项以及如何扩展GridPanel以满足复杂需求。 首先,...

    Extjs gridpanel 出现横向滚动条问题的解决方法

    在使用ExtJS开发Web应用程序时,经常会遇到在GridPanel中数据列过多,导致横向滚动条自动出现的问题。这个问题主要是由于GridPanel的宽度不足以容纳所有的列宽,因此浏览器会自动显示横向滚动条以便用户查看全部数据...

    ExtJS 表格面板GridPanel完整例子

    2. **Model**: 定义数据字段和它们的数据类型。 3. **Columns**: 表示表格列的配置,定义每列的显示内容、宽度、排序等属性。 4. **ViewConfig**: 配置表格的视图样式,如行高、字体大小、行选择等。 5. **Plugins**...

    ExtJS介绍以及GridPanel

    除了GridPanel,ExtJS还提供了许多其他组件,如FormPanel(用于创建表单)、TreePanel(用于展示树形数据结构)、Viewport(全屏布局容器)等,它们共同构成了一个强大的Web开发工具箱。 在源码层面,ExtJS使用了...

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

    在本文中,我们将深入探讨如何使用ExtJS框架在前端动态生成表格,并结合后端数据进行展示。ExtJS是一个强大的JavaScript库,专用于构建富客户端Web应用程序,尤其在创建交互式用户界面方面表现突出。动态生成表格是...

    ExtJS grid过滤操作

    - **Filter Types**:多种内置过滤器类型,如文本、数字、日期等,满足不同数据类型的过滤需求。 - **Column Filters**:在列头中显示过滤图标,用户可以直接在列上设置过滤条件。 2. **动态操作** - **创建过滤...

    extjs4.2+java经典

    在企业级开发中,通常需要前后端分离的架构,Java作为后端语言,可以通过RESTful API与ExtJS进行数据交换。例如,在给定的代码片段中,可以看到ExtJS通过Ajax请求与Java后端交互,更新项目信息。这里的关键点在于...

    EXTJS.GRIDPANEL 日期格式

    GridPanel是ExtJS中一个非常重要的组件,用于展示和编辑表格数据,它具有高度的定制性和灵活性。 ### 一、ExtJS.GridPanel中的日期格式设置 在ExtJS中,日期格式的设置主要涉及两个方面:数据存储格式和数据显示...

    Java + ExtJs示例

    4. **Java后端接口**:Java可以通过Spring MVC或者Servlets提供RESTful服务,接收ExtJS的HTTP请求,处理数据并返回JSON响应。 5. **JDBC操作**:在Java后端,我们可以使用JDBC驱动执行SQL语句,连接到数据库,读取...

Global site tag (gtag.js) - Google Analytics