Results 1 to 10 of 57

Thread: Tooltips on forms and grid are not resizing to the size of the text

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Sencha Premium Member
    Join Date
    Dec 2012
    Posts
    7
    Vote Rating
    7
      6  

    Default Tooltips on forms and grid are not resizing to the size of the text

    On the forms, the 'The field is required' message is not fully visible. The tooltip size is too small. See example in http://docs.sencha.com/ext-js/4-2/#!/example/form/dynamic.html

    We also have tooltips on our column headers and the size of the text too large for the tooltip. In 4.1.3, the size of the tooltip resizes to size of the tooltip text.

  2. #2
    Sencha Premium Member
    Join Date
    Jul 2011
    Posts
    119
    Vote Rating
    5
      1  

    Default

    Sencha, this is a serious problem, tooltips in 4.2.0 are painful. Eg:

    http://docs.sencha.com/ext-js/4-2/extjs-build/examples/form/dynamic.html

    Click on 'first name', then tab to next field. Then hold your cursor over the red error icon. The tooltip is mis-sized.

    Broken in IE10 and Chrome 26.
    Works in Firefox 19

    Ext 4.2.0, Windows 7

  3. #3
    Sencha Premium Member
    Join Date
    Dec 2012
    Posts
    7
    Vote Rating
    7
      1  

  4. #4
    Sencha Premium Member
    Join Date
    Dec 2008
    Posts
    3
    Vote Rating
    0
      0  

    Exclamation

    I have the same problem

  5. #5
    Sencha Premium Member
    Join Date
    Oct 2012
    Posts
    7
    Vote Rating
    1
      0  

    Default

    Here is what I'm seeing with 4.2 GA and QuickTips:
    • Firefox 20.0 - Mac fails
    • Firefox 20.0 - Windows is OK
    • Chrome 26.0.1410.43 - Both Windows and Mac fail
    • IE 10.0.9200.16519 - is OK
    • Safari 6.0.3 7536.28.10 - Mac is OK
    On the failing browsers, I haven't been able to root cause the issue yet. Though the tip element always gets a style attribute of width:40px (if that helps).

  6. #6
    Sencha Premium Member
    Join Date
    Jul 2011
    Posts
    119
    Vote Rating
    5
      0  

    Default

    So a nasty bodge is:

    Code:
        if (Ext.isChrome || Ext.isIE) {
            Ext.override(Ext.tip.Tip, {
                minWidth: 200
            });
        }
    PS. I sometimes see it on IE10 as well, hence the inclusion above

  7. #7
    Sencha User
    Join Date
    Sep 2015
    Posts
    3
    Vote Rating
    0
      0  

    Default

    I am using Extjs 4.2.1. In the grid column using the below code: renderer : function(value, metaData ,record) { metaData.tdAttr = 'data-qtip="tooltip text"'; return value; }Please let me know how to fix this zoom in and zoom out issue in this scenario.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •