1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    34
    Vote Rating
    0
    amist is on a distinguished road

      0  

    Default Unanswered: Panel with Horizontal layout

    Unanswered: Panel with Horizontal layout


    Dear All,
    I want to display details of data as panel but with horizontal layout,
    How i can set panel with horizontal columns ofrow details.

    Thanks

  2. #2
    Sencha Premium Member
    Join Date
    Feb 2009
    Location
    Glasgow, Scotland
    Posts
    342
    Vote Rating
    12
    Answers
    10
    Stuart-SwarmOnline will become famous soon enough Stuart-SwarmOnline will become famous soon enough

      0  

    Default


    Your best bet would be to use the HBox or Column layout.

  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    34
    Vote Rating
    0
    amist is on a distinguished road

      0  

    Default


    Thank you for replay
    I don't htink that these URL's will solve ny problem.
    what i want to do is when the end user click on specific row in gride panel another panel display the full details of this row

    my listener of first gride panel is
    Code:
    listeners: {
    
                   
    'afterrender': function(panel) {
    
                       panel.body.on(
    'click', function(rowIndex,cellIndex,columnIndex,e) {
    
                            
    /**************************************************************/
    
                            
    var pos = panel.getSelectionModel().getSelection();
    
                            record = pos[0].data[
    'ISIN'];
    
    
                            
    if (record && (this.boundRecord !== record)) {
    
                            console.log(
    'bind', record); 
    
                            
    
                            stock_store.load({
    
                              params: {
    
                                stock: record
    
                              },
    
                              scope   : 
    this,
    
                              callback: 
    function(records, operation, success) {
    
                                    
    //here the store has been loaded so you can use what functions you like
    
                                    
    if(stock_store.getCount() !=0)
    
                                    {
    
                                     
    
                                      
    var westPanel = Ext.getCmp('westPanel');
    
                                      
    var westRegion = Ext.getCmp('westRegion');
    
                                      westRegion.remove(westPanel, 
    true);
    
                                      westRegion.add(showpanel1);
    
                                    }
    
                                    
    
    
                              console.log(
    "count",stock_store.getCount());
    
                              console.log(
    "data",stock_store.getAt(0).get('Cmp_Name_en'));
    
                              
    
                            }
    
                              
    /******************************Display West Region**************************************************/
    
                             
    
                            })
    
                            
    
                            
    
    
     
    
     
    
     
    
     
    
                        }
    
                           
    /*******************************************************************/
    
                          
    
                       });
    
                    }
    
                },
    
    which replaod the details store and display the details panel

    my details panel (which didn't display any thing i don't why)

    Code:
    var
     showpanel1 = Ext.define('Ext.Panel',
    
    {
    
     store: stock_store,
    
     tbar: [{
    
                text: 
    'Template',
    
                handler: 
    function(){
    
    
    var
     tpl= new Ext.XTemplate(
    
    '<table style="margin:20px;font-size:13px;font-family:sans-serif">'
    
    + 
    '<tr><td><i>Company Name:</i></td><td><b>{Cmp_Name_en}</b></td></tr>'
    
    + 
    '<tr><td><i>Open:</i></td><td><b>{Open_Price}</b></td></tr>'
    
    + 
    '<tr><td><i>Close:</i></td><td><b>{Close}</b></td></tr>'
    
    + 
    '<tr><td><i>Change:</i></td><td><b>{Change}</b></td></tr>'
    
    + 
    '<tr><td><i>Change %:</i></td><td><b>{ChangP}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Price:</i></td><td><b>{Last_Price}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Trade Qnt.:</i></td><td><b>{Last_Price_Qty}</b></td></tr>'
    
    + 
    '<tr><td><i>High:</i></td><td><b>{High}</b></td></tr>'
    
    + 
    '<tr><td><i>Low:</i></td><td><b>{Low}</b></td></tr>'
    
    + 
    '<tr><td><i>Bids Vol.:</i></td><td><b>{AskV}</b></td></tr>'
    
    + 
    '<tr><td><i>Asks Vol.:</i></td><td><b>{BidV}</b></td></tr>'
    
    + 
    '<tr><td><i>Best Bid:</i></td><td><b>{High_Ask}</b></td></tr>'
    
    + 
    '<tr><td><i>High Ask:</i></td><td><b>{high_bid}</b></td></tr>'
    
    + 
    '<tr><td><i>Low Bid:</i></td><td><b>{Low_Ask}</b></td></tr>'
    
    + 
    '<tr><td><i>Best Ask:</i></td><td><b>{low_bid}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Bid:</i></td><td><b>{last_ask}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Ask:</i></td><td><b>{last_bid}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Bid Qnt.:</i></td><td><b>{last_bid_volume}</b></td></tr>'
    
    + 
    '<tr><td><i>Last Ask Qnt.:</i></td><td><b>{last_ask_volume}</b></td></tr>'
    
    + 
    '<tr><td><i>Best Bid Qnt.:</i></td><td><b>{Low_Ask_Qty}</b></td></tr>'
    
    + 
    '<tr><td><i>Best Bid Qnt.:</i></td><td><b>{High_Bid_Qty}</b></td></tr>'
    
    + 
    '<tr><td><i>Trades Qnt.:</i></td><td><b>{Volume}</b></td></tr>'
    
    + 
    '<tr><td><i>Total Value.:</i></td><td><b>{Value}</b></td></tr>'
    
    + 
    '<tr><td><i>Trades #:</i></td><td><b>{Trades_num}</b></td></tr>'
    
    + 
    '<tr><td><i>Currency:</i></td><td><b>{cucode}</b></td></tr>'
    
    + 
    '</table>'
    
    );
    
     tpl.overwrite(showpanel1.body, stock_store);
    
     }
    
     }]
    });
    
    
    I want to bind the details of store to this show panel.
    your reply will be appreciated

    Thanks

  4. #4
    Sencha User
    Join Date
    Oct 2011
    Posts
    34
    Vote Rating
    0
    amist is on a distinguished road

      0  

    Default


    Simply, How i can render my details store data (get data after user click on row) to this panel (showpanel)

    Thanks

Thread Participants: 1