`
shnsvyu
  • 浏览: 9500 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ext.ux.tree.treegrid异步加载数据

阅读更多
///前台
var grid = new Ext.ux.tree.TreeGrid({
        title: '任务管理',
        width: 500,
        height: 300,
        enableDD: true,
        enableSort:false,  
        rootVisible:false,  
        columns:[{
            header: '任务名称',
            dataIndex: 'Task_ID',
            width: 230
        },{
            header: '开始时间',
            width: 100,
            dataIndex: 'TaskName',
            align: 'center'
        }],
        root:new Ext.tree.AsyncTreeNode({
            id:'0',
            loader:new Ext.tree.TreeLoader({
                 dataUrl: 'Data/Work_Task/Work_Task.aspx?flag=0',
                 listeners:{
                     "beforeload":function(treeloader,node)
                     {
                        treeloader.baseParams={
                        treegrid_id:node.id,
                        method:'POST'
                        };
                     }
                 }  
            })
        }),
        listeners:
        {
            "click":function(node,event)
            {
                if (node.isLeaf()) {
			        event.stopEvent();
		        } else {
				    event.stopEvent();
				    node.toggle();
		        }
            }
        }
      
    });  

 

//后台返回值的方法
 public string GetData_TaskInfo(string _id)
        {
            if (_id == "0") //第一次加载,只加载父节点
            {
                string _fathers = "";
                DataSet dsWorkInfo = TIS.Get_TaskInfo(_id, "");

                foreach (DataRow r_Work in dsWorkInfo.Tables[0].Rows)
                {
                    _fathers += "{leaf: false,id:'" + r_Work[0] + "',";
                    foreach (DataColumn column_Work in dsWorkInfo.Tables[0].Columns)
                    {
                        _fathers += column_Work.ColumnName + ":'" + r_Work[column_Work].ToString() + "',";
                    }
                    _fathers = _fathers.Remove(_fathers.Length - 1, 1);
                    _fathers += "},";
                }
                if (_fathers == "")
                {
                    return "";
                }
                return _fathers = " [" + _fathers.Remove(_fathers.Length - 1, 1) + "]";
            }
            else //第二次加载,加载子节点
            {
                string _fathers = "";
                DataSet dsStageTaskInfo = TIS.Get_StageTask(_id);

                foreach (DataRow r_StageTask in dsStageTaskInfo.Tables[0].Rows)
                {
                    _fathers += "{leaf: true,";
                    foreach (DataColumn column_StageTask in dsStageTaskInfo.Tables[0].Columns)
                    {
                        _fathers += column_StageTask.ColumnName + ":'" + r_StageTask[column_StageTask].ToString() + "',";
                    }
                    _fathers = _fathers.Remove(_fathers.Length - 1, 1);
                    _fathers += "},";
                }
                if (_fathers == "")
                {
                    return "";
                }
                return _fathers = " [" + _fathers.Remove(_fathers.Length - 1, 1) + "]";
            }
        }

 

分享到:
评论

相关推荐

    Ext.ux.tree.treegrid异步加载

    本文详细介绍了如何使用ExtJS中的`Ext.ux.tree.TreeGrid`组件实现异步加载功能,包括前端配置和后端数据处理两个方面。通过这种方式可以有效提升用户体验,同时减轻服务器的压力。在实际开发过程中,还需要根据具体...

    ext treegrid

    "ext.ux.tree.treegrid" 指的是这个组件属于Ext JS的一个第三方插件(UX),UX是Ext JS社区为扩展其核心功能而创建的一系列用户界面组件。这些组件通常不是官方提供的,但它们丰富了Ext JS的功能,使得开发者可以更...

    jquery.treegrid.min.js

    jquery.treegrid.min.js jquery.treegrid.min.jsjquery.treegrid.min.jsjquery.treegrid.min.js

    jquery.treegrid.extension.js

    扩展jquery.treegrid.extension.js,实现jquery-treegrid的懒加载,结合jquery.cookie.js来实现缓存,减缓页面大量数据加载

    jquery-treegrid 树形表格组件

    - **动态加载**:支持异步加载子节点,提高页面性能,特别是处理大量数据时。 - **排序**:提供了列排序功能,用户可以按某一列对数据进行升序或降序排列。 - **搜索与过滤**:内置搜索和过滤机制,帮助用户快速定位...

    ExtJs4.1 treegrid CRUD 读取、新增、修改、删除

    实现treegrid组件的(CRUD)读取、新增、修改、删除 //设置grid单元格处于编辑状态 selcell:function(arow,acol){ this.editingPlugin.startEditByPosition({row:arow,column:acol}); }, selcell2:function(node,...

    TreeGrid.js 表格树插件

    9. **性能优化**:由于表格可能包含大量数据,TreeGrid.js可能采用了懒加载技术,只在需要时加载子节点,减少初次加载时的资源消耗。 10. **文档和示例**:为了方便开发者快速上手,TreeGrid.js通常会提供详细的API...

    EASYUI TREEGRID异步加载数据实现方法

    在EASYUI TreeGrid中,异步加载数据是一项重要的功能,允许用户在需要时动态获取数据,提高应用的性能和用户体验。 异步加载数据通常涉及到以下几个关键点: 1. **配置URL**:在TreeGrid的初始化参数中,`url`属性...

    Ext Js权威指南(.zip.001

    7.5.5 ext.data.treestore加载数据的方法 / 354 7.5.6 store的配置项 / 358 7.5.7 store的分页 / 359 7.5.8 store的排序:ext.util.sorter与ext.util.sortable / 360 7.5.9 store的过滤:ext.util.filter / 363...

    Ext 3.2的一个TreeGrid

    感谢 Ericzhen 远离颠倒梦想,蕴籍无上清凉 这里引用它的资源 仅作分享 http://www.cnblogs.com/Ericzhen/archive/2012/06/11/2545186.html

    editTreeGrid ext可编辑的treegridpanel

    在EXT JS这个强大的JavaScript框架中,`TreeGrid`是一种结合了树形结构和表格功能的组件,它允许用户同时展示数据的层次结构和表格信息。`editTreeGrid`是EXT JS中的一个特例,它是可编辑的TreeGrid面板,提供了在树...

    bootstrap-treegrid.js

    自己封装的bootstrap-treegrid.js来实现树形菜单

    ext TreeGrid分页可编辑

    在Web应用开发中,特别是涉及到复杂数据展示的应用场景中,`Ext TreeGrid`是一种非常实用且灵活的数据展示组件,它结合了树形结构与表格的形式来呈现数据,非常适合展示具有层次关系的数据集合。本文主要探讨如何...

    Extjs treeGrid 本地数据 例子

    在ExtJS中,TreeGrid是通过`Ext.tree.Panel`类实现的,它继承自`Ext.grid.Panel`,增加了树形结构的功能。 在本地数据的例子中,我们通常会用到`Ext.data.TreeStore`来存储和管理数据。TreeStore是ExtJS中的一个...

    bootstrap-table-treegrid.js

    bootstrap-table-treegrid.js

    treegrid.zip_treeGrid wpf_treegrid_treegrid wpf c#_wpf 树状表格_wpf树

    6. **实现数据加载和异步更新**:根据实际需求,可能需要实现异步加载数据,以提高性能和用户体验。 在“TreeGrid1”文件中,可能包含了实现这些功能的XAML和C#代码。例如,XAML文件可能会有如下结构: ```xml ...

    ux.maximgb.treegrid

    而`TreeGrid.packed.js`则是经过压缩和优化的版本,用于生产环境,以减少页面加载时间。在实际应用中,开发者会根据需要选择使用未压缩或压缩后的版本。 `index.css`和`index.html`则是示例文件。`index.html`用于...

    jquery 异步treeTable树形插件

    jQuery异步treeTable插件是用于在网页上实现这种功能的一种高效工具,它结合了表格与树形结构的优点,可以动态加载数据,节省页面资源,提升用户体验。本文将深入探讨这一插件的工作原理、使用方法以及实际应用中的...

    extjs4 treeGrid实例

    在ExtJS4中,TreeGrid主要由`Ext.tree.Panel`类定义,它扩展了`Ext.grid.Panel`,因此具备了表格的所有功能,同时也包含了树结构的特性。 创建一个TreeGrid的第一步是定义模型(Model)。模型定义了数据的字段及其...

Global site tag (gtag.js) - Google Analytics