[CLOSED] Visual Errors for Two text fields with SelectOnFocus = true

  1. #1

    [CLOSED] Visual Errors for Two text fields with SelectOnFocus = true

    Hello,

    Using the code below, there is visual errors when SelectOnFocus is set to true for textfields. This only happens in Chrome. To reproduce:

    1. Click on Field B.
    2. Click anywhere outside your browser.
    3. Click on Field A. (Right away, without having to click on the active browser)

    I'm using ExtJS version 4.2.1.883 with Ext.net version 2.2.0.


    <html>
    <head id="Head1" runat="server">
        <title>The Test Page </title>
        <script type="text/javascript">
        </script>
    </head>
    <body>
        <form runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" ScriptMode="Debug" Namespace="" />
        <ext:Panel ID="Panel1" runat="server" Title="Text Fields with Select On Focus" Width="800"
            Height="600" Layout="FormLayout">
            <Items>
                <ext:TextField runat="server" FieldLabel="Field A" Text="Example Text" SelectOnFocus="true">
                </ext:TextField>
                <ext:TextField runat="server" FieldLabel="Field B" SelectOnFocus="true">
                </ext:TextField>
            </Items>
        </ext:Panel>
        </form>
    </body>
    </html>
    Last edited by Daniil; Jan 21, 2014 at 4:41 AM. Reason: [CLOSED]
  2. #2
    Hi @stratadev,

    Seems I cannot reproduce anything strange.

    What are the visual errors? Could you, please, post a screenshot?
  3. #3
    Hi Daniil,

    It's hard to explain so i've attached a video. Note I click on Field B, then outside, then Field A. on Chrome. I've uploaded the AVI file here since this forum doesn't allow video uploads.

    http://tinypic.com/r/iyefpv/5
  4. #4
    Thank you, reproduced. It is a known issue:
    https://github.com/extnet/Ext.NET/issues/313

    Please try this fix:

    Fix
    Ext.form.field.Text.override({
        beforeFocus : function(){
            var me = this,
                inputEl = me.inputEl,
                emptyText = me.emptyText,
                isEmpty;
    
            Ext.form.field.Text.superclass.beforeFocus.apply(this, arguments);
    
            if ((emptyText && !Ext.supports.Placeholder) && (inputEl.dom.value === me.emptyText && me.valueContainsPlaceholder)) {
                me.setRawValue('');
                isEmpty = true;
                inputEl.removeCls(me.emptyCls);
                me.valueContainsPlaceholder = false;
            } else if (Ext.supports.Placeholder) {
                me.inputEl.removeCls(me.emptyCls);
            }
    
            if (me.selectOnFocus || isEmpty) {
                inputEl.dom.select();
            }
        }
    });

Similar Threads

  1. Replies: 6
    Last Post: Jan 13, 2014, 3:54 AM
  2. [CLOSED] Combobox value and text fields
    By dnguyen in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Nov 19, 2010, 2:59 PM
  3. Replies: 9
    Last Post: Aug 26, 2009, 9:21 AM
  4. [CLOSED] Empty values from text fields
    By CSG in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Apr 21, 2009, 10:14 AM
  5. Replies: 2
    Last Post: Feb 03, 2009, 5:56 PM

Posting Permissions