Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.
  1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default Panel focus does not work in Chrome

    Panel focus does not work in Chrome


    Hi,

    Ext.getCmp('panelID').focus();

    I am unable to focus on the panel in chrome version 18.0.1025.152 m
    but the same works fine for IE9.

    Not sure if this has already been noticed, if yes please ignore.


    Thanks
    Punith

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,197
    Vote Rating
    482
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Can we get more detail? Do you receive an error in the console?

    This tested fine in my copies:
    18.0.1025.151
    18.0.1025.162

    Code:
    Ext.create('Ext.panel.Panel', {
        id: 'panelID',
        title: 'Hello',
        width: 200,
        html: '<p>World!</p>',
        renderTo: Ext.getBody()
    });
    
    var p1 = Ext.getCmp('panelID');
    
    var p1c = p1.focus(); // return instance of panel
    alert(p1c.title); // show title
    Regards,
    Scott.

  3. #3
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default


    Hi Scott,

    Sorry for a delayed reply on this thread.
    Here is the thing.

    I have written 3 views, on a validation in controller i am focusing on the panel where error occurred.

    view :

    Ext.define('view.locateSearch.SelectedOptionsPanel3', {
    extend: 'Ext.panel.Panel',
    alias : 'widget.selectedoptions3',
    title : bundle.getMsg('vl.locate.label.selectedopptions'),
    collapsible :true,
    layout: {
    type: 'column'
    },
    id : 'selectedopptionsId3',
    width : 600,
    height : 150,


    initComponent: function() {
    var me = this;
    Ext.applyIf(me, {
    //Items goes here
    });
    me.callParent(arguments);
    }
    });


    and In controller :

    if(focusYMMOTrue){
    //focus on the panel whose id : selectedopptionsId3.
    Ext.getCmp('selectedopptionsId3').focus();
    }



    i have made 5 panels so i can visualize the scrolling effect.

    this does not work in chrome, but works fine in IE9
    Also if i do any focus on the field, it works in Chrome as well.

    Let me know if its any of my mistakes

    Thanks
    Punith

  4. #4
    Ext JS Premium Member
    Join Date
    Feb 2012
    Posts
    51
    Vote Rating
    0
    shrinkul is on a distinguished road

      0  

    Default


    Hi,
    I have the same issue, please help.

    Thanks,
    Shrinivas

  5. #5
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,197
    Vote Rating
    482
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    I see where you define, but when where do you create? Also ...
    Change to the following to make sure your component is available:

    Code:
    Ext.getCmp('selectedopptionsId3').focus();
    // change to ...
    var s3 = Ext.getCmp('selectedopptionsId3');
    if (s3) { s3.focus(); }
    Please look at the following in your console:

    Code:
    Ext.define('SelectedOptionsPanel3', {
        extend: 'Ext.panel.Panel',
        alias: 'widget.selectedoptions3',
        title: 'bundle',
        collapsible: true,
        layout: {
            type: 'column'
        },
        id: 'selectedopptionsId3',
        width: 600,
        height: 150,
    
        initComponent: function() {
            var me = this;
            Ext.applyIf(me, {
                //Items goes here
            });
            me.callParent(arguments);
        }
    });
    
    var s3 = Ext.getCmp('selectedopptionsId3');    
        
    console.log(s3);
        
    var s3c = Ext.create('SelectedOptionsPanel3', {
        renderTo: Ext.getBody()
    });
    console.log(s3c);
    
    var s3get = Ext.getCmp('selectedopptionsId3');    
    console.log(s3get);
    Regards,
    Scott.

  6. #6
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default No Luck.

    No Luck.


    Hi Scott,
    tried as u mention earlier.

    var s3 = Ext.getCmp('selectedopptionsId3');
    if (s3) { s3.focus(); }
    but no luck here.


    and could u please tell me what to trace in my console on doing"console.log(s3);"

    wat i saw was the
    Ext.Class.newClass (which has all the property for selectedopptionsId3 panel)


    Kindly help us here.

  7. #7
    Ext JS Premium Member
    Join Date
    Feb 2012
    Posts
    51
    Vote Rating
    0
    shrinkul is on a distinguished road

      0  

    Default


    Hi,
    We are not yet able to resolve the issue, any help. We tried all suggestions and lot of things but no success.

    Thanks,
    Shrinivas

  8. #8
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,159
    Vote Rating
    674
    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 haven't really provided enough information. What are you expecting to happen when you focus the panel? Why do you say it doesn't work?
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  9. #9
    Ext JS Premium Member
    Join Date
    Feb 2012
    Posts
    51
    Vote Rating
    0
    shrinkul is on a distinguished road

      0  

    Default


    Hi,
    I have provided the information, in one page I have 4 panels and the fields in top panel are mandatory, when user clicks on "Locate" Button then the focus should come to the mandatory field in top panel but it is not happening. with following method call on panel

    Ext.getCmp('panelID').focus();

    Looking forward to positive response.

    Thanks,
    Shrinivas

  10. #10
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    17,159
    Vote Rating
    674
    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

      1  

    Default


    So, you're trying to focus a field inside the panel? In that case, why are you calling focus on the panel? Why not on the field itself?
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

Thread Participants: 3

Tags for this Thread