What's New?

[CLOSED] ComboBox Blur or Lose Focus

  1. #1
    Jun 22, 2009, 2:48 PM

    [CLOSED] ComboBox Blur or Lose Focus

    Hi Vlad/Geoffery

    I have the following ComboBox

    <ext:ComboBox 
    ID="createSelector"
    HideLabel="true" 
    EmptyText="Create a new..."  
    runat="server" 
    BlankText="Create a new..."
    Editable="false" >
    <Items>
        <ext:ListItem Text="Company" Value="company" />
        <ext:ListItem Text="Contact" Value="contact" />
    </Items>
    <Listeners>
        <Select Fn="createForm" />
    </Listeners>
</ext:ComboBox>
    and the following JS Code

    function createForm(field, oldValue, newValue) {
    var formType;
    if (typeof (oldValue) == 'string') {
        formType = oldValue;
    } else {
        formType = oldValue.data.text;
    }
    if (field != null) {
        field.clearValue();
        field.blur();
    }
    loadTab(appPath + "/" + formType + "/Forms/" + formType + ".aspx?action=create", Ext.id(), "New " + formType);
}
    I'm trying to clear the ComboBox after a user enters a value, so that it shows the Blank/Empty text again. I can't get the ComboBox to lose focus. If I click anywhere else on the form after I click a ComboBox value, all is well. Otherwise it sits there blank, with the cursor.

    Cheers

    Steve
  2. #2
    Jun 22, 2009, 4:50 PM

    RE: [CLOSED] ComboBox Blur or Lose Focus

    Hi,

    Please see the following sample
    <%@ Page Language="C#" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    
    <script type="text/javascript">
        function createForm(field){            
            Ext.fly("focusEl").dom.focus();
            field.hasFocus = false;
            field.clearValue();            
            field.triggerBlur();
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        
        <a id="focusEl" href="#" class="x-dlg-focus">&amp;nbsp;</a>
        
        <ext:ComboBox ID="createSelector" HideLabel="true" EmptyText="Create a new..." runat="server"
            BlankText="Create a new..." Editable="false">
            <Items>
                <ext:ListItem Text="Company" Value="company" />
                <ext:ListItem Text="Contact" Value="contact" />
            </Items>
            <Listeners>
                <Select Fn="createForm" Delay="100" />
            </Listeners>
        </ext:ComboBox>
    </form>
</body>
</html>
    UPDATE: Please note that .triggerBlur() is a private function. It should be used carefully. Also please don't rely on its existence in future releases. Here is a related Ext.NET v3 forum thread.
    Last edited by Daniil; Aug 26, 2015 at 6:22 PM.
  3. #3
    Jul 03, 2009, 3:55 AM

    RE: [CLOSED] ComboBox Blur or Lose Focus

    Hi Vlad,

    Thanks for that. Perfect. The solution appeared to be the delay=100


    Cheers


    Steve

Similar Threads

  1. [CLOSED] ComboBox Focus Expanded
    By jeybonnet in forum 1.x Legacy Premium Help
    Replies: 17
    Last Post: Jan 16, 2013, 3:04 PM
  2. How to change control's background color on focus and on blur?
    By rpk2006 in forum 1.x Help
    Replies: 1
    Last Post: Feb 24, 2012, 5:39 AM
  3. combo box how to lose focus
    By norphos in forum 1.x Help
    Replies: 1
    Last Post: Jun 13, 2011, 2:50 PM
  4. htmleditor missing listeners for focus and blur
    By craig2005 in forum 1.x Help
    Replies: 4
    Last Post: Jan 14, 2011, 9:33 PM
  5. [CLOSED] [1.0] Combobox not firing blur event when in gridpanel editor
    By jchau in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Aug 16, 2010, 8:39 AM

Posting Permissions