This is a migrated thread and some comments may be shown as answers.

Showing Dropdown On TextChanged

6 Answers 443 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

6 Answers, 1 is accepted

answered on 19 Jun 2009, 07:37 AM

Hi David,

Here is the code snippet that I tried in order to show dropdown after TextChanged event is fired.

CS:

    
            protected void RadComboBox2_TextChanged(object sender, EventArgs e) 
        
            { 
        
                string script = "<script language='javascript' type='text/javascript'>Sys.Application.add_load(showDropdown);</script>"; 
        
                ClientScript.RegisterStartupScript(this.GetType(), "showDropdown", script);   
        
            }

ASPX:

    
            <telerik:RadComboBox ID="RadComboBox2" AllowCustomText="true" runat="server" AutoPostBack="True" OnTextChanged="RadComboBox2_TextChanged"> 
        
                <Items> 
        
                    <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem1" Value="RadComboBoxItem1" /> 
        
                    <telerik:RadComboBoxItem runat="server" Text="RadComboBoxItem2" Value="RadComboBoxItem2" /> 
        
                </Items> 
        
            </telerik:RadComboBox>

JavaScript:

    
            <script type="text/javascript"> 
        
            function showDropdown() 
        
            { 
        
                var combo = $find("<%= RadComboBox2.ClientID %>"); 
        
                combo.showDropDown(); 
        
            } 
        
            </script>

Thanks,
Shinu.

answered on 19 Jun 2009, 01:04 PM

Shinu,

Thanks for the reply. Unfortunately, I had already tried that and it did not work. The problem is that I've wrapped my combobox in a user control which is then placed on a webform. The client-side code to handle showing the drop is in the user control, and like your example, I figured it would be as easy as adding a call to the proper client-side function to show the drop down. Unfortunately, I ran into what seems to be a common problem with the rad controls: Adding script via the RegisterClientScriptBlock() or RegisterStartupScript() methods emits the client-side code before the embedded client-side code that initializes the telerik objects. This results in calls to $find() returning null references.

For anyone who has this problem, I solved it by hooking into the RadCombo.OnClientLoad event. I placed the following code snippet into the server-side Page_Load event of my user control. This code emits client-side code that will load the combo into a variable declared outside of a function and thus available to other functions:

    
            ScriptManager.RegisterClientScriptBlock(this, Page.GetType(), "GetCombo", "var combo; function  OnClientLoad(sender){ combo = sender;}", true);

Then later in my server-side TextChanged event handler, I utilize the ResponseScripts.Add() method of a RadAjaxManager to emit client-side code to access the combo var that was initialized in the code block above:

    
            ajaxManager.ResponseScripts.Add("combo.showDropDown();");

I admit that it's a little hokey, but I have verified that it works in both FF and IE and is the best way that I can see to get around the timing issue of when the ScriptManager object emits its client-side code versus when the embedded client-side code to initialize the telerik objects is emitted.

What would be very helpful would be server-side methods included with some of these Rad controls that would emit such client-side code automatically. For instance, a server-side method called RadCombo.ShowDropDown() that would encapsulate a lot of this work.

Anyway, I hope this helps someone else, and if anyone else knows of a more reliable or easy-to-read way, please don't hesitate to post it.

Accepted