1. #1
    Sencha User
    Join Date
    Jun 2008
    Posts
    9
    Vote Rating
    0
    mikeschthecat is on a distinguished road

      0  

    Question Unanswered: Desktop :: Click on row/cell in grid opens new Window

    Unanswered: Desktop :: Click on row/cell in grid opens new Window


    I need help with following Problem:

    i would open a new Window on click or doubleclick in a grid row.

    The Grid works fine, all entrys are visible after loading.

    In the modules/desktop/App.js are all modules defined:

    modules/desktop/App.js:
    PHP Code:
            requires: [
                    ...
                    
    'MyDesktop.FormServerDetails',
                    
    'MyDesktop.GridServerListe',
                    ...
            ],

    ...

            
    getModules : function(){
                    return [
                            ...
                            new 
    MyDesktop.FormServerDetails(),
                            new 
    MyDesktop.GridServerListe(),
                            ...
                    ];
            }, 

    modules/desktop/GridServerListe.js:
    PHP Code:
    Ext.define('MyDesktop.GridServerListe', {
            
    extend'Ext.ux.desktop.Module',

            
    requires: [
                    
    'Ext.data.*',
                    
    'Ext.util.Format',
                    
    'Ext.grid.*'
            
    ],

            
    id:'grid-servers',

            
    init : function(){
                    
    this.launcher = {
                            
    text'Server Liste',
                            
    iconCls:'icon-grid',
                            
    handler this.createWindow,
                            
    scopethis
                    
    };
            },

            
    createWindow : function(){
                    var 
    desktop this.app.getDesktop();
                    var 
    win desktop.getWindow('grid-servers');

                    
    Ext.define('ServerListe', {
                            
    extend'Ext.data.Model',
                            
    fields: [
                                            
    'server_id',
                                            
    'servername',
                                            
    'memory',
                                            
    'os',
                                            
    'service_tag',
                                            
    'support_id',
                                            
    'support'
                            
    ]
                    });

                    var 
    store_serverListe = new Ext.data.Store({
                            
    model'ServerListe',
                            
    proxy: {
                                    
    type'ajax',
                                    
    url'/remote/get_server_liste.php',
                                    
    reader: {
                                            
    type'json',
                                            
    root'servers'
                                    
    }
                            }
                    });

                    var 
    grid_serverListe = new Ext.grid.Panel({
                            
    borderfalse,
                            
    storestore_serverListe,
                            
    columns: [
                                    new 
    Ext.grid.RowNumberer(),
                                    {
                                            
    text"Server ID",
                                            
    dataIndex:'server_id',
                                            
    hidden:true
                                    
    },{
                                            
    text"Servername",
                                            
    flex1,
                                            
    sortabletrue,
                                            
    dataIndex'servername'
                                    
    },{
                                            
    text"Memory",
                                            
    dataIndex'memory',
                                            
    width:130
                                    
    },{
                                            
    text"OS",
                                            
    dataIndex:'os',
                                            
    width:200
                                    
    },{
                                            
    text"Service TAG",
                                            
    dataIndex:'service_tag',
                                            
    width:80
                                    
    },{
                                            
    text"Support ID",
                                            
    dataIndex:'support_id',
                                            
    hidden:true
                                    
    },{
                                            
    text"Support",
                                            
    dataIndex:'support'
                                    
    }
                            ]
                    });

                    
    grid_serverListe.on('itemclick', function(merecord){
                            
    console.log('itemclick :: server_id:   '+record.data.server_id);
                            
    console.log('itemclick :: servername:  '+record.data.servername);
                            
    console.log('itemclick :: memory:      '+record.data.memory);
                            
    console.log('itemclick :: os:          '+record.data.os);
                            
    console.log('itemclick :: service_tag: '+record.data.service_tag);
                            
    console.log('itemclick :: support_id:  '+record.data.support_id);
                            
    console.log('itemclick :: support:     '+record.data.support);

    /*
                            // doesn't work :(
                            // Errormessage: win_contactDetails is undefined
                            var win_serverDetails=Ext.getCmp('form-serverDetails');
                            win_serverDetails.show();
    */
                    
    });



                    if(!
    win){
                            
    win desktop.createWindow({
                                    
    listeners:{
                                            
    afterrender: function(){
                                                    
    store_serverListe.load();
                                            },
                                            
    itemclick : function() {
                                                    var 
    data win.getSelectionModel().selected.items[0].data;
                                                    
    alert(data);
                                            }
                                    },

                                    
    id'grid-servers',
                                    
    title:'Server Liste',
                                    
    viewConfig: {
                                            
    stripeRowstrue
                                    
    },
                                    
    width:740,
                                    
    height:480,
                                    
    iconCls'icon-grid',
                                    
    animCollapse:false,
                                    
    constrainHeader:true,
                                    
    layout'fit',
                                    
    items: [
                                            
    grid_serverListe
                                    
    ],
                                    
    tbar:[{
                                            
    text:'Add Something',
                                            
    tooltip:'Add a new row',
                                            
    iconCls:'add'
                                    
    }, '-', {
                                            
    text:'Options',
                                            
    tooltip:'Blah blah blah blaht',
                                            
    iconCls:'option'
                                    
    },'-',{
                                            
    text:'Remove Something',
                                            
    tooltip:'Remove the selected item',
                                            
    iconCls:'remove'
                                    
    }]
                            });
                    }
                    
    win.show();
                    return 
    win;
            },
    }); 
    modules/desktop/FormServerDetails.js
    PHP Code:
    Ext.define('MyDesktop.FormServerDetails', {
            
    extend'Ext.ux.desktop.Module',

            
    requires: [
                    
    'Ext.form.*'
            
    ],

            
    id:'form-serverDetails',

            
    init : function(){
                    
    this.launcher = {
                            
    text'Server Details',
                            
    iconCls:'icon-grid',
                            
    handler this.createWindow,
                            
    scopethis,
                            
    windowId'form-serverDetails'
                    
    };
            },

            
    createWindow : function(){
                    var 
    desktop this.app.getDesktop();
                    var 
    win desktop.getWindow('form-serverDetails');

                    if(!
    win){

                            var 
    form Ext.widget('form', {
                                    
    layout: {
                                            
    type'vbox',
                                            
    align'stretch'
                                    
    },
                                    
    borderfalse,
                                    
    bodyPadding10,

                                    
    fieldDefaults: {
                                            
    labelAlign'top',
                                            
    labelWidth100,
                                            
    labelStyle'font-weight:bold'
                                    
    },
                                    
    defaults: {
                                            
    margins'0 0 10 0'
                                    
    },
                                    
    items: [{
                                            
    xtype'fieldcontainer',
                                            
    fieldLabel'Servername',
                                            
    labelStyle'font-weight:bold;padding:0',
                                            
    layout'hbox',
                                            
    defaultType'textfield',

                                            
    fieldDefaults: {
                                                    
    labelAlign'top'
                                            
    },

                                            
    items: [{
                                                    
    flex1,
                                                    
    name'serverName',
                                                    
    fieldLabel'First',
                                                    
    allowBlankfalse
                                            
    }]
                            });

                            
    win desktop.createWindow({

                                    
    id'form-serverDetails',
                                    
    title:'Server Details',
                                    
    closeAction'hide',
                                    
    width:740,
                                    
    height:480,
                                    
    animCollapse:false,
                                    
    constrainHeader:true,
                                    
    layout'fit',
                                    
    modaltrue,
                                    
    items: [
                                            
    form
                                    
    ]
                            });
                            
    win.show();
                            return 
    win;
                    }
            }
    }); 
    Can anyone please help me with this issue ?

    Best regards
    Mikesch

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,801
    Answers
    3467
    Vote Rating
    834
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    What's the issue? Have you been able to listen for the itemclick event?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jun 2008
    Posts
    9
    Vote Rating
    0
    mikeschthecat is on a distinguished road

      0  

    Default


    Hi Mitchell,

    thanks for your very fast response.

    Yes, i see in the console when i click/doubleclick the entrys from the selected Row,
    but i dont know how i can show the MyDesktop.FormServerDetails, if i doubleclick on the row.

    My target is, wenn i doubleclick on any row, a new Detail Window (PopUp) will open and shows additional Server Informations.

    regards
    Mikesch

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,801
    Answers
    3467
    Vote Rating
    834
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    In your click or doubleclick listener, just Ext.create the class and show it:

    Code:
    Ext.create('MyDesktop.FormServerDetails').show();
    I will warn you that it looks like you are using id on that class and you will have collisions. I would suggest not using id at all. It should only be used for debugging.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  5. #5
    Sencha User
    Join Date
    Jun 2008
    Posts
    9
    Vote Rating
    0
    mikeschthecat is on a distinguished road

      0  

    Default


    Hi Mitchell,

    which id's do you mean ?

    1.)
    PHP Code:
    Ext.define('MyDesktop.GridServerListe', {
    ...
            
    id:'grid-servers',

    ... 
    2.)
    PHP Code:
                    if(!win){
                            
    win desktop.createWindow({
    ...
                                    
    id'grid-servers'



    i have added Ext.create('MyDesktop.FormServerDetails').show(); to grid_serverListe.on
    but i become a errormessage when i doubleclick on any row

    Where is my fault ?

    PHP Code:
                    grid_serverListe.on('itemdblclick', function(merecord){
                            
    console.log('itemdblclick :: server_id:   '+record.data.server_id);
                            
    console.log('itemdblclick :: servername:  '+record.data.servername);
                            
    console.log('itemdblclick :: memory:      '+record.data.memory);
                            
    console.log('itemdblclick :: os:          '+record.data.os);
                            
    console.log('itemdblclick :: service_tag: '+record.data.service_tag);
                            
    console.log('itemdblclick :: support_id:  '+record.data.support_id);
                            
    console.log('itemdblclick :: support:     '+record.data.support);
                            
    Ext.create('MyDesktop.FormServerDetails').show();
                    }); 


    Ext.create("MyDesktop.FormServerDetails").show is not a function




    regards
    Mikesch

  6. #6
    Sencha User
    Join Date
    Jun 2008
    Posts
    9
    Vote Rating
    0
    mikeschthecat is on a distinguished road

      0  

    Default


    Have anyone an idee ??

    Please help

    PHP Code:
    grid_serverListe.on('itemdblclick', function(merecord){
                            
    console.log('itemdblclick :: server_id:   '+record.data.server_id);
                            
    console.log('itemdblclick :: servername:  '+record.data.servername);
                            
    console.log('itemdblclick :: memory:      '+record.data.memory);
                            
    console.log('itemdblclick :: os:          '+record.data.os);
                            
    console.log('itemdblclick :: service_tag: '+record.data.service_tag);
                            
    console.log('itemdblclick :: support_id:  '+record.data.support_id);
                            
    console.log('itemdblclick :: support:     '+record.data.support);
                            
    Ext.create('MyDesktop.FormServerDetails').show();
                    }); 
    Ext.create("MyDesktop.FormServerDetails").show is not a function


    I use the Desktop module from example.

    I would open a new window if anyone doubleclick on the grid (cell/row),
    but nothing works

    regards
    Mikesch

  7. #7
    Sencha User
    Join Date
    Jan 2013
    Posts
    2
    Vote Rating
    0
    jepedregosa is on a distinguished road

      0  

    Default


    I have the same problem. Can anyone give a solution for this? Thank you so much

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi