1. #1
    Sencha User
    Join Date
    Apr 2011
    Posts
    31
    Vote Rating
    0
    Dengqiao Huang is on a distinguished road

      0  

    Default select firstRow has Problem

    select firstRow has Problem


    Browser versions tested against:

    IE 9 ,Firefox 10

    Description:

    If the "refresh" event select the first row, rendering error.




    Test Case:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
        <title></title>
        <link rel="stylesheet" type="text/css" href="../../Ext4/resources/css/ext-all.css"/>
        <script type="text/javascript" src="../../ext4/ext-all-dev.js"></script>  
        <script type="text/javascript" src="../../ext4/src/diag/layout/Context.js"></script>  
        <script type="text/javascript" src="../../ext4/src/diag/layout/ContextItem.js">
        <script type="text/javascript" src="../../Ext4/locale/Ext-lang-zh_CN.js"></script>
        <style type="text/css">
        </style>
    </head>
    <body>    
        <script type="text/javascript">
    
            Ext.define('Order', {
                extend: 'Ext.data.Model',
                fields: [
                    {name:'OrderID',type:"int"},
                    'CustomerID','CustomerName',
                    {name:'OrderDate',type:"date",format:"Y-m-d"}
                ],
                idProperty:"OrderID",
                hasMany:{model:"OrderDetail",name:"OrderDetails",foreignKey:"OrderID"}
            });
            
            Ext.define('OrderDetail',{
                extend: 'Ext.data.Model',
                fields: [
                    {name:'OrderID',type:"int"},
                    {name:'ProductID',type:"int"},                
                    {name:'UnitPrice',type:"float"},
                    {name:'Quantity',type:"int"},
                    {name:'Discount',type:"float"},                
                    'ProductName'
                ]
            });
    
    
    
            Ext.onReady(function(){
                if(Ext.BLANK_IMAGE_URL.substr(0,4)!="data"){            
                    Ext.BLANK_IMAGE_URL="./images/s.gif";
                }
    
                //在此添加ExtJS代码
    
                Ext.create("Ext.data.Store",{
                    model:'Order',
                    pageSize:50,
                    proxy: {
                        type: 'ajax',
                        api:{
                            read:'Customer.ashx?act=OrderList'
                        },                    
                        reader:{
                            type: 'json',
                            root:"data"
                        }
                    },
                    storeId:"OrderStore"
                })
    
                Ext.create("Ext.data.Store",{
                    model:'OrderDetail',
                    storeId:"OrderDetailStore"
                })
                
                Ext.create("Ext.data.TreeStore",{
                    proxy: {
                        type: 'ajax',
                        url:"Customer.ashx?act=CustomerList"
                    },
                    storeId:"CustomerStore"
                })
                
                
                Ext.create("Ext.Viewport",{
                    layout:"border",
                    padding: 5,
                    items:[
                        {xtype:"treepanel",
                            title:"Customer",
                            region:"west",
                            weight:50,
                            collapsible: true,
                            rootVisible:false,
                            store:"CustomerStore",
                            width:200,
                            minWidth:100,
                            weight:50,
                            split:true,
                            viewConfig:{
                                listeners:{
                                    refresh:function(){
                                        //this.select(0);
                                    }
                                }
                            },
                            listeners:{
                                selectionchange:function(model,sels){
                                    if(sels.length>0){
                                        var rs=sels[0],
                                            store=Ext.StoreMgr.lookup("OrderStore");
                                        store.proxy.extraParams.CustomerID=rs.data.id;
                                        store.load();
                                    }
                                }
                            }
                        },
                        {xtype:"gridpanel",
                            title:"Order",
                            region:"center",
                            minWidth:200,
                            minHeight:200,
                            tbar:{xtype:"pagingtoolbar",store:"OrderStore"},
                            selMode:{mode:"SINGLE"},
                            collapsible: true,
                            columns:[
                                {xtype:"rownumberer",sortable:false,width:60},
                                {text:'Order ID',dataIndex:'OrderID'},
                                {text:'Customer ID',dataIndex:'CustomerID'},
                                {text:'Customer',dataIndex:'CustomerName',sortable:false,flex:1},
                                {xtype:"datecolumn",text:'Order Date',dataIndex:'OrderDate',format:"Y-m-d",width:100}
                            ],
                            viewConfig:{
                                listeners:{
                                    refresh:function(){
                                        this.select()
                                    }
                                }
                            },
                            listeners:{
                                selectionchange:function(model,rs){
                                    if(rs.length>0){
                                        var g=Ext.getCmp("DetailsGrid"),
                                            store=model.view.store;
                                        g.store.loadRecords(rs[0].OrderDetailsStore.data.items);
                                    }
                                }
                            }
                        },
                        {xtype:"gridpanel",
                            id:"DetailsGrid",
                            title:"Order Details",
                            region:"south",
                            split:true,
                            height:300,
                            minHeight:200,
                            collapsible: true,
                            columns:[
                                {xtype:"rownumberer",sortable:false,width:60},
                                {text:'Product Name',dataIndex:'ProductName',sortable:false,flex:1},
                                {xtype:"numbercolumn",text:'Price',dataIndex:'UnitPrice',align:"right",format:"0,0.00"},
                                {xtype:"numbercolumn",text:'Quantity',dataIndex:'Quantity',format:"0,0"},
                                {xtype:"numbercolumn",text:'Discount',dataIndex:'Discount',format:"0,0.00"}
                            ]
                        }
                    ]
                });
                
            });
        </script>
    </body>
    </html>
    Has “this.select(0)” in TreePanel:
    3-1.jpg

    No “this.select(0)” in TreePanel:
    3-2.jpg

  2. #2
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,996
    Vote Rating
    649
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    You'll need to provide more info, I can't reproduce this using B1 or the latest code:

    Code:
    Ext.onReady(function() {
    
        var tree = Ext.create('Ext.tree.Panel', {
            renderTo: document.body,
            width: 200,
            height: 250,
            root: {
                text: 'Foo',
                expanded: true,
                children: [{
                    text: 'An item',
                    leaf: true
                }]
            },
            viewConfig: {
                listeners: {
                    refresh: function(){
                        this.select(0);
                    }
                }
            }
        });
        
    });
    Not sure what the grids have to do with the test case, so I've removed them.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  3. #3
    Sencha User
    Join Date
    Apr 2011
    Posts
    31
    Vote Rating
    0
    Dengqiao Huang is on a distinguished road

      0  

    Default


    I change the TreeStore:
    Code:
                Ext.create("Ext.data.TreeStore",{
                    proxy: {
                        type: 'ajax',
                        url:"tree.js"
                    },
                    storeId:"CustomerStore"
                })
    tree.js:
    Code:
    [
      {
        "id": "all",
        "text": "All",
        "leaf": true
      },
      {
        "id": "ALFKI",
        "text": "Alfreds Futterkiste",
        "leaf": true
      },
      {
        "id": "ANATR",
        "text": "Ana Trujillo Emparedados y helados",
        "leaf": true
      },
      {
        "id": "ANTON",
        "text": "Antonio Moreno Taquería",
        "leaf": true
      },
      {
        "id": "AROUT",
        "text": "Around the Horn",
        "leaf": true
      },
      {
        "id": "BERGS",
        "text": "Berglunds snabbk?p",
        "leaf": true
      },
      {
        "id": "BLAUS",
        "text": "Blauer See Delikatessen",
        "leaf": true
      },
      {
        "id": "BLONP",
        "text": "Blondesddsl père et fils",
        "leaf": true
      },
      {
        "id": "BOLID",
        "text": "Bólido Comidas preparadas",
        "leaf": true
      },
      {
        "id": "BONAP",
        "text": "Bon app'",
        "leaf": true
      },
      {
        "id": "BOTTM",
        "text": "Bottom-Dollar Markets",
        "leaf": true
      },
      {
        "id": "BSBEV",
        "text": "B's Beverages",
        "leaf": true
      },
      {
        "id": "CACTU",
        "text": "Cactus Comidas para llevar",
        "leaf": true
      },
      {
        "id": "CENTC",
        "text": "Centro comercial Moctezuma",
        "leaf": true
      },
      {
        "id": "CHOPS",
        "text": "Chop-suey Chinese",
        "leaf": true
      },
      {
        "id": "COMMI",
        "text": "Comércio Mineiro",
        "leaf": true
      },
      {
        "id": "CONSH",
        "text": "Consolidated Holdings",
        "leaf": true
      },
      {
        "id": "WANDK",
        "text": "Die Wandernde Kuh",
        "leaf": true
      },
      {
        "id": "DRACD",
        "text": "Drachenblut Delikatessen",
        "leaf": true
      },
      {
        "id": "DUMON",
        "text": "Du monde entier",
        "leaf": true
      },
      {
        "id": "EASTC",
        "text": "Eastern Connection",
        "leaf": true
      },
      {
        "id": "ERNSH",
        "text": "Ernst Handel",
        "leaf": true
      },
      {
        "id": "FAMIA",
        "text": "Familia Arquibaldo",
        "leaf": true
      },
      {
        "id": "FISSA",
        "text": "FISSA Fabrica Inter. Salchichas S.A.",
        "leaf": true
      },
      {
        "id": "FOLIG",
        "text": "Folies gourmandes",
        "leaf": true
      },
      {
        "id": "FOLKO",
        "text": "Folk och f? HB",
        "leaf": true
      },
      {
        "id": "FRANR",
        "text": "France restauration",
        "leaf": true
      },
      {
        "id": "FRANS",
        "text": "Franchi S.p.A.",
        "leaf": true
      },
      {
        "id": "FRANK",
        "text": "Frankenversand",
        "leaf": true
      },
      {
        "id": "FURIB",
        "text": "Furia Bacalhau e Frutos do Mar",
        "leaf": true
      },
      {
        "id": "GALED",
        "text": "Galería del gastrónomo",
        "leaf": true
      },
      {
        "id": "GODOS",
        "text": "Godos Cocina Típica",
        "leaf": true
      },
      {
        "id": "GOURL",
        "text": "Gourmet Lanchonetes",
        "leaf": true
      },
      {
        "id": "GREAL",
        "text": "Great Lakes Food Market",
        "leaf": true
      },
      {
        "id": "GROSR",
        "text": "GROSELLA-Restaurante",
        "leaf": true
      },
      {
        "id": "HANAR",
        "text": "Hanari Carnes",
        "leaf": true
      },
      {
        "id": "HILAA",
        "text": "HILARION-Abastos",
        "leaf": true
      },
      {
        "id": "HUNGC",
        "text": "Hungry Coyote Import Store",
        "leaf": true
      },
      {
        "id": "HUNGO",
        "text": "Hungry Owl All-Night Grocers",
        "leaf": true
      },
      {
        "id": "ISLAT",
        "text": "Island Trading",
        "leaf": true
      },
      {
        "id": "KOENE",
        "text": "K?niglich Essen",
        "leaf": true
      },
      {
        "id": "LACOR",
        "text": "La corne d'abondance",
        "leaf": true
      },
      {
        "id": "LAMAI",
        "text": "La maison d'Asie",
        "leaf": true
      },
      {
        "id": "LAUGB",
        "text": "Laughing Bacchus Wine Cellars",
        "leaf": true
      },
      {
        "id": "LAZYK",
        "text": "Lazy K Kountry Store",
        "leaf": true
      },
      {
        "id": "LEHMS",
        "text": "Lehmanns Marktstand",
        "leaf": true
      },
      {
        "id": "LETSS",
        "text": "Let's Stop N Shop",
        "leaf": true
      },
      {
        "id": "LILAS",
        "text": "LILA-Supermercado",
        "leaf": true
      },
      {
        "id": "LINOD",
        "text": "LINO-Delicateses",
        "leaf": true
      },
      {
        "id": "LONEP",
        "text": "Lonesome Pine Restaurant",
        "leaf": true
      },
      {
        "id": "MAGAA",
        "text": "Magazzini Alimentari Riuniti",
        "leaf": true
      },
      {
        "id": "MAISD",
        "text": "Maison Dewey",
        "leaf": true
      },
      {
        "id": "MEREP",
        "text": "Mère Paillarde",
        "leaf": true
      },
      {
        "id": "MORGK",
        "text": "Morgenstern Gesundkost",
        "leaf": true
      },
      {
        "id": "NORTS",
        "text": "North/South",
        "leaf": true
      },
      {
        "id": "OCEAN",
        "text": "Océano Atlántico Ltda.",
        "leaf": true
      },
      {
        "id": "OLDWO",
        "text": "Old World Delicatessen",
        "leaf": true
      },
      {
        "id": "OTTIK",
        "text": "Ottilies K?seladen",
        "leaf": true
      },
      {
        "id": "PARIS",
        "text": "Paris spécialités",
        "leaf": true
      },
      {
        "id": "PERIC",
        "text": "Pericles Comidas clásicas",
        "leaf": true
      },
      {
        "id": "PICCO",
        "text": "Piccolo und mehr",
        "leaf": true
      },
      {
        "id": "PRINI",
        "text": "Princesa Isabel Vinhos",
        "leaf": true
      },
      {
        "id": "QUEDE",
        "text": "Que Delícia",
        "leaf": true
      },
      {
        "id": "QUEEN",
        "text": "Queen Cozinha",
        "leaf": true
      },
      {
        "id": "QUICK",
        "text": "QUICK-Stop",
        "leaf": true
      },
      {
        "id": "RANCH",
        "text": "Rancho grande",
        "leaf": true
      },
      {
        "id": "RATTC",
        "text": "Rattlesnake Canyon Grocery",
        "leaf": true
      },
      {
        "id": "REGGC",
        "text": "Reggiani Caseifici",
        "leaf": true
      },
      {
        "id": "RICAR",
        "text": "Ricardo Adocicados",
        "leaf": true
      },
      {
        "id": "RICSU",
        "text": "Richter Supermarkt",
        "leaf": true
      },
      {
        "id": "ROMEY",
        "text": "Romero y tomillo",
        "leaf": true
      },
      {
        "id": "SANTG",
        "text": "Santé Gourmet",
        "leaf": true
      },
      {
        "id": "SAVEA",
        "text": "Save-a-lot Markets",
        "leaf": true
      },
      {
        "id": "SEVES",
        "text": "Seven Seas Imports",
        "leaf": true
      },
      {
        "id": "SIMOB",
        "text": "Simons bistro",
        "leaf": true
      },
      {
        "id": "SPECD",
        "text": "Spécialités du monde",
        "leaf": true
      },
      {
        "id": "SPLIR",
        "text": "Split Rail Beer & Ale",
        "leaf": true
      },
      {
        "id": "SUPRD",
        "text": "Suprêmes délices",
        "leaf": true
      },
      {
        "id": "THEBI",
        "text": "The Big Cheese",
        "leaf": true
      },
      {
        "id": "THECR",
        "text": "The Cracker Box",
        "leaf": true
      },
      {
        "id": "TOMSP",
        "text": "Toms Spezialit?ten",
        "leaf": true
      },
      {
        "id": "TORTU",
        "text": "Tortuga Restaurante",
        "leaf": true
      },
      {
        "id": "TRADH",
        "text": "Tradi??o Hipermercados",
        "leaf": true
      },
      {
        "id": "TRAIH",
        "text": "Trail's Head Gourmet Provisioners",
        "leaf": true
      },
      {
        "id": "VAFFE",
        "text": "Vaffeljernet",
        "leaf": true
      },
      {
        "id": "VICTE",
        "text": "Victuailles en stock",
        "leaf": true
      },
      {
        "id": "VINET",
        "text": "Vins et alcools Chevalier",
        "leaf": true
      },
      {
        "id": "WARTH",
        "text": "Wartian Herkku",
        "leaf": true
      },
      {
        "id": "WELLI",
        "text": "Wellington Importadora",
        "leaf": true
      },
      {
        "id": "WHITC",
        "text": "White Clover Markets",
        "leaf": true
      },
      {
        "id": "WILMK",
        "text": "Wilman Kala",
        "leaf": true
      },
      {
        "id": "WOLZA",
        "text": "Wolski  Zajazd",
        "leaf": true
      }
    ]
    This is only in the "TreeStore" of data will occur when the remote data.
    3-3.jpg

    Firebug tips:
    el is null
    el.addCls.apply(el, arguments);
    ext-all-dev.js (43917 Lines)

Thread Participants: 1