Update combobox's text on Ajax postback

[Peichung]

Hi,

I am wondering how I can update combobox's text on Ajax postback.  I have tried using AjaxManager and AjaxPanel, but none of them worked.  I am using 2008 Q2 trial.  Here are what I have:


Using AjaxManager
[ASPX]

<telerik:RadComboBox ID="RadComboBox1" AllowCustomText="true" 
    RadComboBoxImagePosition="Left" Text="" AutoPostBack="true" 
    OnSelectedIndexChanged="OnComboSelectedChange" Runat="server" >
    <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
</telerik:RadComboBox>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadComboBox1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadComboBox1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

 

 

[C#]

 

 

protected void OnComboSelectedChange(object o, Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e)
{
    RadComboBox1.Text = RadComboBox1.SelectedIndex.ToString();
}

 

 

Using AjaxPanel
[ASPX]
<telerik:RadAjaxPanel ID="RadAjaxPanel3" runat="server">
    <telerik:RadComboBox ID="RadComboBox1" AllowCustomText="true"
        RadComboBoxImagePosition="Left" Text="" AutoPostBack="true"
        OnSelectedIndexChanged="OnComboSelectedChange" Runat="server" >
        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
    </telerik:RadComboBox>
</telerik:RadAjaxPanel>


[C#]
protected void Page_PreRender(object sender, EventArgs e)
{
    if (RadAjaxPanel3.IsAjaxRequest)
    {
        RadComboBox1.Text = RadComboBox1.SelectedIndex.ToString();
    }
}

 

[Rosi]

Hello Peichung,

I suggest you remove this setting Text="" from the control aspx definition and let us known how this goes.

Regards,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Peichung]

Hi Rosi,

Thank you for the reply.  I've removed Text="" but it didn't help.  The combobox still shows selected item's text instead of custom text.

Peichung

[Rosi]

Hi Peichung,

You can try the following code:

Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e)
{
   RadComboBox1.ClearSelection();
   RadComboBox1.Text = RadComboBox1.SelectedIndex.ToString();
}

 

Regards,

Regards, Rosi
the Telerik team

 

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Peichung]

Hi Rosi,

Thanks for the reply.  ClearSelection() did help refresh RadComboBox1.Text.  Here is what I have:

 

protected void OnComboSelectedChange(object o, Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e)
{
    RadComboBox1.Text = RadComboBox1.SelectedIndex.ToString();
    RadComboBox1.ClearSelection();
}

However, I have a minor problem of seeing selected item's text flashed for a very short period of time before RadComboBox1.Text was set to desired custom text.  For example, I have Apple and Orange in the combobox.  Ideally, when selection was changed from Apple to Orange, I would like to see 1 since 1 is Orange's selected index.  Now, I am seeing the text "Orange" being flashed for a couple milliseconds in RadComboBox1.Text before it shows 1.  I am wondering if it is possible to suppress such flashing behavior.  Thanks,

Peichung

[Rosi]

Hello Peichung,

When you click an item the text of the item is set to the input. This is the expected behavior and this is by design.

You can hook on the OnClientSelectedIndexChanged event of RadComboBox and change the text there in its event handler:
<script>
function OnClientSelectedIndexChanged(sender,e)
{ 
    sender.set_text(e.get_item().get_index().toString());
}
</script>
Greetings,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Peichung]

Thanks Rosi.  Client side OnClientSelectedIndexChanged worked for me.  Unfortunately, it cannot coexist with the server side OnSelectedIndexChanged because my RadComboBox1.ClearSelection(); statement in the server side event handler will trigger a client side OnClientSelectedIndexChanged event, which subsequently will set the text to -1 (unselected).  Is there any way that I can tell in OnClientSelectedIndexChanged that the event was fired from the server side handler so that I can ignore it?  If not, I guess my only option is to live completely in the client side.  Thank you so much for your help.

[Rosi]

Hello Peichung,

The OnClientSelectedIndexChanged is fired before the control to do a postback and before the SelectedIndexChanged event to be fired. The text is set to "-1" as a result of calling the ClearSelection method.

If you want the text of RadComboBox to be the index of the SelectedItem I suggest you to change the text only in the OnClientSelectedIndexChanged event as I showed you.

All the best,
Rosi
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Peichung]

Hi Rosi,

Thank you very much for the great help.