[CLOSED] render treecolumn problem

Page 1 of 2 12 LastLast
  1. #1

    [CLOSED] render treecolumn problem

    Click image for larger version. 

Name:	QQ截图20130711231635.jpg 
Views:	28 
Size:	20.9 KB 
ID:	6529Click image for larger version. 

Name:	QQ截图20130711231913.jpg 
Views:	23 
Size:	41.9 KB 
ID:	6530
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="role_menu.aspx.cs" Inherits="extdemo.admin.pages.role_menu" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script>
            var roleRenderer = function (value) {
                if (!Ext.isEmpty(value)) {
                    return App.store_role1.getById(value).data.rolename;
                }
                return value;
            };
            var menuRenderer = function (value) {
                if (value != null && value != '') {
                    var r = App.store_menu.getNodeById(value);
    
                    if (!Ext.isEmpty(r)) {
                        return r.data.text;
                    }
     
                }
            };
    
            var fn1 = function(value) {
                this.field.onTriggerClick();
                App.btn_save.setDisabled(false);
    
            };
    
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server"></ext:ResourceManager>
            <ext:GridPanel runat="server" ID="gp_role" Title="角色菜单管理">
                <TopBar>
                    <ext:Toolbar ID="Toolbar1" runat="server">
                        <Items>
                            <ext:Button ID="btn_add" runat="server" Icon="Add" Text="新增">
                                <Listeners>
                                    <Click Handler="App.store_role.insert(0,{rolename:'新角色'});App.btn_save.enable();"></Click>
                                </Listeners>
                            </ext:Button>
                            <ext:Button runat="server" Text="删除" Icon="Delete" ID="btn_del">
                                <Listeners>
                                    <Click Handler="var selection = #{RowSelectionModel}.getSelection();
                                                    if (selection) {
                                                        #{gp_role}.store.remove(selection);
                                                    };App.btn_save.enable();" />
                                </Listeners>
                            </ext:Button>
                            <ext:Button ID="btn_save" runat="server" Icon="Disk" Text="确定" Disabled="True">
                                <DirectEvents>
                                    <Click OnEvent="e_save" Before="return #{store_role}.isDirty();">
                                        <ExtraParams>
                                            <ext:Parameter Name="data" Value="#{store_role}.getChangedData()" Mode="Raw" Encode="true" />
                                        </ExtraParams>
                                    </Click>
                                </DirectEvents>
                            </ext:Button>
    
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Store>
                    <ext:Store runat="server" ID="store_role">
                        <Proxy>
                            <ext:AjaxProxy Url="~/admin/pages/role_menu_handler.ashx">
                                <ActionMethods Read="GET"></ActionMethods>
                                <Reader>
                                    <ext:JsonReader Root="data" />
                                </Reader>
                            </ext:AjaxProxy>
                        </Proxy>
                        <Model>
                            <ext:Model ID="Model1" runat="server" IDProperty="id">
                                <Fields>
                                    <ext:ModelField runat="server" Name="id">
                                    </ext:ModelField>
                                    <ext:ModelField runat="server" Name="roleid"></ext:ModelField>
                                    <ext:ModelField runat="server" Name="menuid"></ext:ModelField>
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel>
                    <Columns>
                        <ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" />
                        <ext:Column ID="Column1" runat="server" DataIndex="id" Text="编号"></ext:Column>
                        <ext:Column ID="Column2" runat="server" Text="角色" DataIndex="roleid" Flex="1">
                            <Renderer Fn="roleRenderer" />
    
                            <Editor>
                                <ext:SelectBox runat="server" ID="cb_role" DisplayField="rolename" ValueField="id">
                                    <Store>
                                        <ext:Store runat="server" ID="store_role1">
                                            <Model>
                                                <ext:Model ID="Model2" runat="server">
                                                    <Fields>
                                                        <ext:ModelField runat="server" Name="id"></ext:ModelField>
                                                        <ext:ModelField runat="server" Name="rolename"></ext:ModelField>
                                                    </Fields>
                                                </ext:Model>
                                            </Model>
                                        </ext:Store>
                                    </Store>
                                </ext:SelectBox>
                            </Editor>
                            <EditorOptions>
                                <Listeners>
                                    <StartEdit Fn="fn1" Delay="1" />
                                </Listeners>
                            </EditorOptions>
                        </ext:Column>
                        <ext:Column ID="Column3" runat="server" DataIndex="menuid" Flex="1" Text="菜单">
                           <Renderer Fn="menuRenderer"></Renderer>
                            <Editor>
                                <ext:DropDownField runat="server" Mode="ValueText" TriggerIcon="SimpleArrowDown">
                                    <Component>
                                        <ext:TreePanel ID="TreePanel1" runat="server" RootVisible="false" Animate="true" AutoScroll="true" >
                                            <Store>
                                                <ext:TreeStore runat="server" ID="store_menu">
                                                    <Proxy>
                                                        <ext:AjaxProxy Url="../handlers/Handler_menu1.ashx">
                                                        </ext:AjaxProxy>
                                                    </Proxy>
                                                    <Model>
                                                        <ext:Model ID="Model3" runat="server" IDProperty="id">
                                                            <Fields>
                                                                <ext:ModelField runat="server" Name="id"></ext:ModelField>
                                                                <ext:ModelField runat="server" Name="name"></ext:ModelField>
    
                                                            </Fields>
                                                        </ext:Model>
                                                    </Model>
                                                </ext:TreeStore>
                                            </Store>
                                            <ColumnModel>
                                                <Columns>
                                                    <ext:TreeColumn ID="TreeColumn1" runat="server" Text="名称" DataIndex="name" Flex="1">
                                                         
                                                    </ext:TreeColumn>
                                                </Columns>
                                            </ColumnModel>
                                            <Listeners>
                                                
                                            </Listeners>
                                        </ext:TreePanel>
    
                                    </Component>
                                </ext:DropDownField>
    
    
                            </Editor>
                        </ext:Column>
    
                    </Columns>
                </ColumnModel>
                <BottomBar>
                    <ext:PagingToolbar ID="PagingToolbar1" runat="server">
                    </ext:PagingToolbar>
                </BottomBar>
                <Plugins>
                    <ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
                </Plugins>
                <SelectionModel>
                    <ext:RowSelectionModel ID="RowSelectionModel" Mode="Multi" runat="server" />
                </SelectionModel>
    
            </ext:GridPanel>
        </form>
    </body>
    </html>
    Last edited by Daniil; Jul 23, 2013 at 12:57 PM. Reason: [CLOSED]
  2. #2
    the column menuid is Associate width database's column menuid, when page is load , through menuRenderer to find the name by menuid, but App.store_menu is undefined?
  3. #3
    Hi @hdsoso,

    A DropDownField's Component (a TreePanel in your case) is rendered when it is expanded first time.

    If a TreePanel is not rendered, then its TreeStore is also not rendered.

    So, App.store_menu is accessed before its rendering, therefore it causes a JavaScript error.

    As a solution you could move the TreeStore out from the TreePanel and DropDownField.
  4. #4
    Quote Originally Posted by Daniil View Post
    Hi @hdsoso,

    A DropDownField's Component (a TreePanel in your case) is rendered when it is expanded first time.

    If a TreePanel is not rendered, then its TreeStore is also not rendered.

    So, App.store_menu is accessed before its rendering, therefore it causes a JavaScript error.

    As a solution you could move the TreeStore out from the TreePanel and DropDownField.
    where to move TreeStore and how to call it in treepanel ?
    move tree store to gridpanel ? but the gridpanel has already one store,
    Suppose move the store to somewhere and set id = "store_menu", how to refer to the store_menu in the TreePanel ?
  5. #5
    Quote Originally Posted by hdsoso View Post
    Suppose move the store to somewhere and set id = "store_menu", how to refer to the store_menu in the TreePanel ?
    Yes, exactly. You can put the TreeStore into the GridPanel's Bin.

    Then associate it to the TreePanel by setting StoreID="store_menu" for that TreePanel.
  6. #6
    Quote Originally Posted by Daniil View Post
    Yes, exactly. You can put the TreeStore into the GridPanel's Bin.

    Then associate it to the TreePanel by setting StoreID="store_menu" for that TreePanel.
    I try to add store to gridpanel's Bin, but vs show "invalid control type".
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="role_menu.aspx.cs" Inherits="extdemo.admin.pages.role_menu" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <script>
            var roleRenderer = function (value) {
                if (!Ext.isEmpty(value)) {
                    return App.store_role1.getById(value).data.rolename;
                }
                return value;
            };
            var menuRenderer = function (value) {
                if (value != null && value != '') {
                    var r = App.store_menu.getNodeById(value);
    
                    if (!Ext.isEmpty(r)) {
                        return r.data.name;
                    }
    
                }
            };
    
            var fn1 = function (value) {
                this.field.onTriggerClick();
                App.btn_save.setDisabled(false);
    
            };
    
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server"></ext:ResourceManager>
    
            <ext:GridPanel runat="server" ID="gp_role" Title="角色菜单管理">
                <TopBar>
                    <ext:Toolbar ID="Toolbar1" runat="server">
                        <Items>
                            <ext:Button ID="btn_add" runat="server" Icon="Add" Text="新增">
                                <Listeners>
                                    <Click Handler="App.store_role.insert(0,{rolename:'新角色'});App.btn_save.enable();"></Click>
                                </Listeners>
                            </ext:Button>
                            <ext:Button runat="server" Text="删除" Icon="Delete" ID="btn_del">
                                <Listeners>
                                    <Click Handler="var selection = #{RowSelectionModel}.getSelection();
                                                    if (selection) {
                                                        #{gp_role}.store.remove(selection);
                                                    };App.btn_save.enable();" />
                                </Listeners>
                            </ext:Button>
                            <ext:Button ID="btn_save" runat="server" Icon="Disk" Text="确定" Disabled="True">
                                <DirectEvents>
                                    <Click OnEvent="e_save" Before="return #{store_role}.isDirty();">
                                        <ExtraParams>
                                            <ext:Parameter Name="data" Value="#{store_role}.getChangedData()" Mode="Raw" Encode="true" />
                                        </ExtraParams>
                                    </Click>
                                </DirectEvents>
                            </ext:Button>
    
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Store>
                    <ext:Store runat="server" ID="store_role">
                        <Proxy>
                            <ext:AjaxProxy Url="~/admin/pages/role_menu_handler.ashx">
                                <ActionMethods Read="GET"></ActionMethods>
                                <Reader>
                                    <ext:JsonReader Root="data" />
                                </Reader>
                            </ext:AjaxProxy>
                        </Proxy>
                        <Model>
                            <ext:Model ID="Model1" runat="server" IDProperty="id">
                                <Fields>
                                    <ext:ModelField runat="server" Name="id">
                                    </ext:ModelField>
                                    <ext:ModelField runat="server" Name="roleid"></ext:ModelField>
                                    <ext:ModelField runat="server" Name="menuid"></ext:ModelField>
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <Bin>
                    <ext:TreeStore runat="server" ID="store_menu">
                        <Proxy>
                            <ext:AjaxProxy Url="../handlers/Handler_menu1.ashx">
                            </ext:AjaxProxy>
                        </Proxy>
                        <Model>
                            <ext:Model ID="Model3" runat="server" IDProperty="id">
                                <Fields>
                                    <ext:ModelField runat="server" Name="id"></ext:ModelField>
                                    <ext:ModelField runat="server" Name="name"></ext:ModelField>
    
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:TreeStore>
                </Bin>
     
                
                <ColumnModel>
                    <Columns>
                        <ext:RowNumbererColumn ID="RowNumbererColumn1" runat="server" />
                        <ext:Column ID="Column1" runat="server" DataIndex="id" Text="编号"></ext:Column>
                        <ext:Column ID="Column2" runat="server" Text="角色" DataIndex="roleid" Flex="1">
                            <Renderer Fn="roleRenderer" />
    
                            <Editor>
                                <ext:SelectBox runat="server" ID="cb_role" DisplayField="rolename" ValueField="id">
                                    <Store>
                                        <ext:Store runat="server" ID="store_role1">
                                            <Model>
                                                <ext:Model ID="Model2" runat="server">
                                                    <Fields>
                                                        <ext:ModelField runat="server" Name="id"></ext:ModelField>
                                                        <ext:ModelField runat="server" Name="rolename"></ext:ModelField>
                                                    </Fields>
                                                </ext:Model>
                                            </Model>
                                        </ext:Store>
                                    </Store>
                                </ext:SelectBox>
                            </Editor>
                            <EditorOptions>
                                <Listeners>
                                    <StartEdit Fn="fn1" Delay="1" />
                                </Listeners>
                            </EditorOptions>
                        </ext:Column>
                        <ext:Column ID="Column3" runat="server" DataIndex="menuid" Flex="1" Text="菜单">
                            <Renderer Fn="menuRenderer"></Renderer>
                            <Editor>
                                <ext:DropDownField runat="server" Mode="ValueText" TriggerIcon="SimpleArrowDown">
                                    <Component>
                                        <ext:TreePanel ID="TreePanel1" runat="server" RootVisible="false" Animate="true" AutoScroll="true" StoreID="store_menu">
    
                                            <ColumnModel>
                                                <Columns>
                                                    <ext:TreeColumn ID="TreeColumn1" runat="server" Text="名称" DataIndex="name" Flex="1">
                                                    </ext:TreeColumn>
                                                </Columns>
                                            </ColumnModel>
                                            <Listeners>
                                            </Listeners>
                                        </ext:TreePanel>
    
                                    </Component>
                                </ext:DropDownField>
    
    
                            </Editor>
                        </ext:Column>
    
                    </Columns>
                </ColumnModel>
                <BottomBar>
                    <ext:PagingToolbar ID="PagingToolbar1" runat="server">
                    </ext:PagingToolbar>
                </BottomBar>
                <Plugins>
                    <ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="1" />
                </Plugins>
                <SelectionModel>
                    <ext:RowSelectionModel ID="RowSelectionModel" Mode="Multi" runat="server" />
                </SelectionModel>
    
            </ext:GridPanel>
        </form>
    </body>
    </html>
    Click image for larger version. 

Name:	QQ截图20130713104129.jpg 
Views:	13 
Size:	30.9 KB 
ID:	6543Click image for larger version. 

Name:	QQ截图20130713103549.jpg 
Views:	15 
Size:	35.8 KB 
ID:	6544Click image for larger version. 

Name:	QQ截图20130713103346.jpg 
Views:	15 
Size:	32.8 KB 
ID:	6545

    may be the store_menu does not init when page is load.
  7. #7
    I could not reproduce the errors with the test case, I have no Handler_menu1.ashx and role_menu_handler.ashx.
  8. #8
    Quote Originally Posted by Daniil View Post
    I could not reproduce the errors with the test case, I have no Handler_menu1.ashx and role_menu_handler.ashx.
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using ExtDemoEf;
    using System.Text;
    using model.crm.hdsoso.com;
    
    namespace extdemo.handlers
    {
        /// <summary>
        /// Handler_menu1 的摘要说明
        /// </summary>
        public class Handler_menu1 : IHttpHandler
        {
    
            MenuService menusrv = new MenuService();
            public void ProcessRequest(HttpContext context)
            {
                context.Response.ContentType = "text/json";
    
                string json = buildjson(0, null);
                string str = "[" + json.Substring(0, json.Length - 1) + "]";
    
                context.Response.Write(str);
                context.Response.End();
            }
            public string buildjson(int pid, StringBuilder sb)
            {
                List<menu> ll = menusrv.getMenuList(pid);
                int n = ll.Count;
                int i = 0;
                foreach (var item in ll)
                {
    
                    menu sm = item;
                    if (sb == null)
                    {
                        sb = new StringBuilder();
                    }
                    sb.Append("{");
                    sb.Append("'id':'" + sm.id + "',");
                    sb.Append("'name':'" + sm.name + "',");
                  //  sb.Append("'AllowDrag':'true',");
                    sb.Append("'pid':'" + sm.pid + "',");
                    sb.Append("'url':'" + sm.url + "'");
                    if (!menusrv.isLeaf(sm.id))
                    {
                        sb.Append(",");
                        sb.Append("'expanded': true,");
                        sb.Append("children:[");
                        buildjson(sm.id, sb);
                        sb.Append("]");
                        sb.Append("},");
    
                    }
                    else
                    {
                        i = i + 1;
                        sb.Append(",'leaf':true");
                        if (i != n)
                        {
                            sb.Append("},");
                        }
                        else
                        {
                            sb.Append("}");
                        }
                    }
                }
    
                return sb.ToString();
            }
    
            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
        }
    }
    using System.Web;
    using Ext.Net;
    using Service;
    
    namespace extdemo.admin.pages
    {
        /// <summary>
        /// role_menu_handler 的摘要说明
        /// </summary>
        public class role_menu_handler : IHttpHandler
        {
            readonly RoleMenuService _roleMenuService = new RoleMenuService();
            public void ProcessRequest(HttpContext context)
            {
                context.Response.ContentType = "application/json";
                var requestParams = new StoreRequestParameters(context);
                int start = requestParams.Start;
                int limit = requestParams.Limit;
                int count;
                var data = _roleMenuService.PageRoleList(start, limit, out count);
                var datas = new Paging<object>(data, count);
                context.Response.Write(JSON.Serialize(datas));
            }
    
            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
        }
    }
     public class RoleMenuDao
        {
            crmEntities ent = new crmEntities();
            public List<rolemenu> PageRoleList(int start, int limit, out int count)
            {
                int totalRecords = ent.rolemenus.Count();
                count = totalRecords;
                var ll = ent.rolemenus.OrderByDescending(s=>s.id).Skip(start).Take(limit).ToList();
                return ll;
            }
  9. #9
    I don't think this will compile on our side.
    crmEntities ent = new crmEntities();
    Also I don't think it is required to get a runnable test case. Please replace with some dummy data.
  10. #10
    Quote Originally Posted by Daniil View Post
    I don't think this will compile on our side.
    crmEntities ent = new crmEntities();
    Also I don't think it is required to get a runnable test case. Please replace with some dummy data.
    //------------------------------------------------------------------------------
    // <auto-generated>
    //    此代码是根据模板生成的。
    //
    //    手动更改此文件可能会导致应用程序中发生异常行为。
    //    如果重新生成代码,则将覆盖对此文件的手动更改。
    // </auto-generated>
    //------------------------------------------------------------------------------
    
    namespace model.crm.hdsoso.com
    {
        using System;
        using System.Data.Entity;
        using System.Data.Entity.Infrastructure;
        
        public partial class crmEntities : DbContext
        {
            public crmEntities()
                : base("name=crmEntities")
            {
            }
        
            protected override void OnModelCreating(DbModelBuilder modelBuilder)
            {
                throw new UnintentionalCodeFirstException();
            }
        
            public DbSet<customer> customers { get; set; }
            public DbSet<menu> menus { get; set; }
            public DbSet<role> roles { get; set; }
            public DbSet<rolemenu> rolemenus { get; set; }
            public DbSet<roleuser> roleusers { get; set; }
            public DbSet<sysdiagram> sysdiagrams { get; set; }
            public DbSet<t_table> t_table { get; set; }
            public DbSet<user> users { get; set; }
        }
    }
    this is generated by entity framework according database
    Click image for larger version. 

Name:	QQ截图20130715212602.jpg 
Views:	13 
Size:	62.6 KB 
ID:	6551
Page 1 of 2 12 LastLast

Similar Threads

  1. [CLOSED] how can i set TreePanel TreeColumn locked=true
    By UT007 in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: May 17, 2013, 3:32 PM
  2. [CLOSED] Render problem with CalendarPanel
    By John_Writers in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: Apr 10, 2013, 4:41 PM
  3. [CLOSED] TreePanel with more than one TreeColumn
    By RCN in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: May 11, 2012, 11:34 AM
  4. GroupTabPanel problem with Render() on a new tab
    By PeterParsonage in forum 1.x Help
    Replies: 1
    Last Post: Feb 28, 2011, 10:57 PM
  5. Checkboxgroup render problem
    By Richardt in forum 1.x Help
    Replies: 1
    Last Post: Sep 03, 2009, 8:23 AM

Posting Permissions