使用Ext.util.TaskRunner类实现，Ext的API中有示例,grid页面自动刷新

最新推荐文章于 2018-09-27 20:43:10 发布

goodboyy

最新推荐文章于 2018-09-27 20:43:10 发布

阅读量2.2k

点赞数

文章标签： ext api stylesheet function html header

本文链接：https://blog.csdn.net/goodboyy/article/details/5730215

版权

是这样的？？我有个不段变化的数据源。。想grid显示的随数据源不段变化。可是为什么grid显示就是不变啊。。grid里面的store是不段变的，，真晕啊，，那位大大帮忙看看啊。。。
Java代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="HFC2.aspx.cs" Inherits="pro_HFC2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="../js/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="../js/ext-base.js"></script>
    <script src="../js/ext-all.js"></script>
    <script type="text/javascript" src="../js/ext-lang-zh_CN.js"></script>
    <script type="text/javascript" src="../js/Portal.js"></script>
    <script type="text/javascript" src="../js/PortalColumn.js"></script>
    <script type="text/javascript" src="../js/Portlet.js"></script>
    <link href="../js/portal.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">Ext.BLANK_IMAGE_URL = '../images/default/s.gif';</script>


</head>
<script>
     Ext.onReady(function(){

var task={run:function(){
     Ext.Ajax.request({
          url:'../pro/HFC2.aspx?cmd=grid',
                     success:function(response){
                    var data=Ext.decode(response.responseText);
//因为有几个grid，所以打算1次取到所有数据，再分个要的grid
                    var store = new Ext.data.SimpleStore({
                        fields: [
                            {name: 'oid'},
                            {name: 'value'}
                        ]
                    });

                     var cm=new Ext.grid.ColumnModel([
                             {header:'名称',dataIndex:"oid",width:152, align:'center'},
                             {header:'参数',dataIndex:"value",width:150, align:'center'}
                            ]);
                        var grid = new Ext.grid.GridPanel({
                            width:325,
                            height:300,
                           stripeRows: true,
                           autoScroll:true,
                           cm:cm,
                          // renderTo:'grid',
                           store:store
                        });

                        if(document.getElementById("grid").innerHTML=="")
                        {
                            grid.render("grid");
                        }
                        //store.removeAll();
                        //grid.render("grid");
                        grid.store.loadData(data);//store里面的数据是变的。但为什么显示不变啊？？

？？

                        //alert(store.getAt(1).get('value') )
                        //grid.store.reload();
                      // grid.reconfigure(store,cm);
                    },
                    failure:function(){}
     });

     }, interval:3000};
        var taskRunner=new Ext.util.TaskRunner();
        taskRunner.start(task);
var viewport = new Ext.Viewport({
        border :false,
       autoScroll:true,
        region:'nori',
        items:[
        {
            xtype:'portal',
            margins:'5 0 5 0',
            items:[{
                columnWidth:.33,
                style:'padding:3px 0 3px 3px',
                items:[{
                    title: 'aa',
                    html: "<div id='main' style:'height:500px'>d</div>"
                }]
            },{
                columnWidth:.33,

                style:'padding:3px 0 3px 3px',
                items:[{
                    title: '基本属性',
//                    items:[grid]
                     html:"<div id='grid'></div>"
                }]
            },{
                columnWidth:.33,
                style:'padding:3px 0 3px 3px',
                items:[{
                    title: '统计信息',
                    html: "dadad"
                },{
                    title: 'Another Panel 3',
                    html: "dadad"
                }]
                }
             ]
        },{title:'da',html:'ddaa',height:100}
        ]
    });


     });
</script>
<body>
    <div id="nori"></div>

</body>
</html>

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="HFC2.aspx.cs" Inherits="pro_HFC2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="../js/ext-all.css" rel="stylesheet" type="text/css" />
    <script src="../js/ext-base.js"></script>
    <script src="../js/ext-all.js"></script>
    <script type="text/javascript" src="../js/ext-lang-zh_CN.js"></script>
    <script type="text/javascript" src="../js/Portal.js"></script>
    <script type="text/javascript" src="../js/PortalColumn.js"></script>
    <script type="text/javascript" src="../js/Portlet.js"></script>
    <link href="../js/portal.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">Ext.BLANK_IMAGE_URL = '../images/default/s.gif';</script>

</head>
<script>
     Ext.onReady(function(){

var task={run:function(){
     Ext.Ajax.request({
          url:'../pro/HFC2.aspx?cmd=grid',
                     success:function(response){
                    var data=Ext.decode(response.responseText);
//因为有几个grid，所以打算1次取到所有数据，再分个要的grid
                    var store = new Ext.data.SimpleStore({
                        fields: [
                            {name: 'oid'},
                            {name: 'value'}
                        ]
                    });

？？

                        //alert(store.getAt(1).get('value') )
                        //grid.store.reload();
                      // grid.reconfigure(store,cm);
                    },
                    failure:function(){}
     });

     }, interval:3000};
        var taskRunner=new Ext.util.TaskRunner();
        taskRunner.start(task);
var viewport = new Ext.Viewport({
        border :false,
       autoScroll:true,
        region:'nori',
        items:[
        {
            xtype:'portal',
            margins:'5 0 5 0',
            items:[{
                columnWidth:.33,
                style:'padding:3px 0 3px 3px',
                items:[{
                    title: 'aa',
                    html: "<div id='main' style:'height:500px'>d</div>"
                }]
            },{
                columnWidth:.33,

                style:'padding:3px 0 3px 3px',
                items:[{
                    title: '基本属性',
//                    items:[grid]
                     html:"<div id='grid'></div>"
                }]
            },{
                columnWidth:.33,
                style:'padding:3px 0 3px 3px',
                items:[{
                    title: '统计信息',
                    html: "dadad"
                },{
                    title: 'Another Panel 3',
                    html: "dadad"
                }]
                }
             ]
        },{title:'da',html:'ddaa',height:100}
        ]
    });


     });
</script>
<body>
    <div id="nori"></div>

</body>
</html>

问题补充：
我用grid.reconfigure(store, new Ext.grid.ColumnModel(cm));
怎么包错啊。包错信息：this.view is null

问题补充：
自己解决了
--------------------------------------------------------------------------------
该问题已经关闭: 自己解决了
问题答案可能在这里 → 寻找更多解答
Ext 实现更新列标题和数据,同时满足分组等现实问题
请教大家如何将页面的布局做成图2的那样？？
如何获取上级容器？[GridPanel->bbar(PagingToolbar)->Item中获取GridPanel?]
SOS EXT Grid 如和提交大侠们
EXTJS传值问题

回答

其实很简单的,主要就是以下三项.
//重新绑定grid
this.grid.reconfigure(newStore, new Ext.grid.ColumnModel(cm1));
//重新绑定分页工具栏
this.pagingBar.bind(newStore);
//重新加载数据集
newStore.load({params:{start:0,limit:10}});

lovewhzlq (CTO) 2009-06-23
设置一个定时器进行轮询，每隔多少秒调用一次加载store的url，然后重新load
laitaogood (资深程序员) 2009-06-23
lovewhzlq 正解

Ext: 双击Gird中的一行，获取这行记录，然后实时刷新另外一个Grid
Grid, Ext, Gird, 实时, 获取
JScript code
groupInfoGrid.addListener('rowdblclick', groupInfoDetailed);
function groupInfoDetailed(){
groupInfoDetailedStore.removeAll();
var record = groupInfoGrid.getSelectionModel().getSelected();
var dname=record.data['dutyname'];
var alarmtask = {
run: function(){
alert(dname);
groupInfoDetailedStore.load({params:{gname: dname}});
},
interval: 5000
}
Ext.TaskMgr.start(alarmtask);
}
假如grid如下：
A     123
B     456
C     789
当我双击A，弹出A，然后每5秒刷新一次
当我双击B，然后B，A 或者A，B然后每5秒刷新一次
这就不对了分析原因应该是执行了2个Task
这个该如何解决，始终让它执行双击的grid？

收藏分享 00 0 我顶我踩

发短消息
加为好友
shla08801 当前离线

UID1007749 帖子114 精华0 积分562 阅读权限10 在线时间18 小时注册时间2007-11-14 最后登录2010-7-10
新手

2#
shla08801发表于 2010-3-18 15:29 | 只看该作者
因为你的groupInfoDetailedStore是个全局变量，所以groupInfoDetailedStore.load会刷新两个grid，
如果想要只执行一个task，
可以在执行前先停止其它的task
JScript code
var alarmtask = {
run: function(){
alert(dname);
groupInfoDetailedStore.load({params:{gname: dname}});
},
interval: 5000
}
[color=#FF0000]Ext.TaskMgr.stopAll();[/color]
Ext.TaskMgr.start(alarmtask);

TOP

发短消息
加为好友
shaozr 当前离线

UID1007708 帖子104 精华0 积分559 阅读权限10 在线时间16 小时注册时间2007-11-10 最后登录2010-7-9
新手

3#
shaozr发表于 2010-3-19 17:38 | 只看该作者
还有个问题请教，如何判断一个task是否start？
HTML code
var task = {
run: function(){
Ext.fly('clock').update(new Date().format('g:i:s A'));
},
interval: 1000 //1秒
}
var runner = new Ext.util.TaskRunner();
runner.start(task);
如何知道这个task是否启动？

TOP