Ext之日期处理

最新推荐文章于 2022-12-15 23:42:09 发布

qinjingkai

最新推荐文章于 2022-12-15 23:42:09 发布

阅读量90

点赞数

文章标签： EXT JavaScript CSS HTML prototype ViewUI

Ext开发中为了把一个对象显示到页面,首选就是ColumnMode了，但如果一个对象的属性是日期类型的话就要注意很多细节了。很多人喜欢在后台写一个日期转化成字符串的类，其实这是不太合理的，一个是因为不够灵活，而是因为这些Ext已经为我们做了封装没必要做那么多额外的工作；先总结如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>测试001.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../scripts/ext/resources/css/ext-all.css"/>
    <script type="text/javascript" src="../scripts/ext/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="../scripts/ext/ext-all.js"></script>
    <script type="text/javascript" src="../scripts/ext/examples.js"></script>
    <script type="text/javascript" src="../scripts/ext/ext-lang-zh_CN.js"></script>
     <script type="text/javascript" src="stu.js"></script>
    <style>
            .color_red{
                background:lightgreen;
            }
        </style>

    <script type="text/javascript">

    function formatDate(value){
                    alert("value调用了");
                return Ext.util.Format.date(value,"Y-m-d");
            }



       Ext.onReady(function(){
       Ext.QuickTips.init();
            Ext.form.Field.prototype.msgTarget='side';
       var sm=new Ext.grid.CheckboxSelectionModel();

           var ds=new Ext.data.Store ({
            proxy:new Ext.data.HttpProxy({
                  url:'../getSomeStu.do',
                  method:'post'
            }),
            reader:new Ext.data.JsonReader({
               root:'list',
               totalProperty:'totalCount',
               fields:[
                      {name:"stuId"},
                      {name:"name"},
                      {name:"sex"},
                      {name:"birthday"},
                      {name:"passport"},
               ]
            })

         });


       var cm=new Ext.grid.ColumnModel ([sm,
                                         {header:'编号',dataIndex:'stuId',width:100},
                                         {header:'名字',dataIndex:'name',width:100},
                                         {header:'性别',dataIndex:'sex',width:100},
                                         {header:'出生年月',dataIndex:'birthday',width:170,
                                              renderer:function(value,cellmeta,record,rowIndex,columnIndex,color_store){
                                                if(value!=null){
                                                  return temp=new Date(value.time).format('Y-m-d');


                                                }else{
                                                    return null;
                                                }

                                              }
                                            },
                                         {header:'身份证号',dataIndex:'passport',width:100},
                                         {header:'操作',dataIndex:'stuId',width:300,
                                             renderer:function(value,cellmeta,record,rowIndex,columnIndex,color_store){
                                                var hrefHtml="<a href=javascript:createStuForm("+null+")><img src='../images/add.gif' title='新增学生'></a>";
                                                  hrefHtml+="<a href=javascript:createStuForm("+value+")><img src='../images/forum.gif' title='查看学生信息'></a>"
                                                 return hrefHtml;
                                              }
                                         }
                                         ]);



         var totalStudent=new Ext.grid.GridPanel ({
                     el:'totalStudent',
                     renderTo:'totalStudent',
                     width:1000,
                     height:400,
                     ds:ds,
                     cm:cm,
                     sm:sm,
                     bbar:new Ext.PagingToolbar({
                     store:ds,
                     pageSize:2,
                     displayInfo:true,
                     emptyMsg:'找不到相关数据'
                     })

         });

         ds.load({params:{start:0,limit:2}});
         totalStudent.render();



       });



    </script>

</head>

<body>
     <div id="totalStudent"></div>
</body>
</html>

要特别注意Y-m-d的大小写形式，否则可能就不是你想要的日期格式了;具体格式可以参考http://hintcnuie.iteye.com/blog/254294

qinjingkai

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Ext之日期处理

Ext开发中为了把一个对象显示到页面,首选就是ColumnMode了，但如果一个对象的属性是日期类型的话就要注意很多细节了。很多人喜欢在后台写一个日期转化成字符串的类，其实这是不太合理的，一个是因为不够灵活，而是因为这些Ext已经为我们做了封装没必要做那么多额外的工作；先总结如下：&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Trans...
复制链接

扫一扫