How to reset ComboBox

[Levi]

How do I reset a combobox after a user selects an item so that they can reselect the same item again and refire the selectindexchanged event? I tried using clearSelection() but this method does not work. If i select an item and then drop down the combobox box again after calling clearSelection(), the same item is still selected. I'm using 2008 Q3. I tried all different combinations of set_Value, clearSelection(), etc. Some of them work if I click away from the combobox. But this won't work for me. I have a special "custom" item the user can select over and over to bring up a calendar.

        function valueChanged(sender, eventArgs) {
                var item = eventArgs.get_item();
                var combo = $find("<%= RadComboBox3.ClientID %>");
                if (sender.get_value()=="DateRange")
                {     
                    combo.clearSelection();
                    
                    combo.set_value(null);                    
                    combo.set_text("7 Day Period");                                    
                    alert(combo.get_selectedIndex());
                }

[Simon]

Hello Levi,

I am not able to fully understand what the issue is.

Could you please paste here the definition of your ComboBox as well as the client-side logic implemented in relation to it?

Once I reproduce the issue I will try providing you with a solution or a workaround.

Sincerely yours,
Simon
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Levi]

Hello Simon,
Thanks for responding. I basically want to unhighlight/unselect whatever is selected in the combobox after the user clicks on the custom item. Since the user needs to be able to reselect the item again and refire the event, I need to resent the combobox as if no item has been selected yet.

 <telerik:RadComboBox ID="RadComboBox3" runat="server" Skin="swSimple" EnableEmbeddedSkins="false"
        OnClientSelectedIndexChanged="valueChanged" OnClientLoad="comboOnLoad" AllowCustomText="false"
        CssClass="Combo">
        <Items>
            <telerik:RadComboBoxItem runat="server" Text="Today" Value="Today" />
            <telerik:RadComboBoxItem runat="server" Text="Yesterday" Value="Yesterday" />
            <telerik:RadComboBoxItem runat="server" Text="Last 7 Days" Value="Last7Days" />
            <telerik:RadComboBoxItem runat="server" Text="Last 30 Days" Value="Last30Days" />
            <telerik:RadComboBoxItem runat="server" Text="This Month" Value="ThisMonth" />
            <telerik:RadComboBoxItem runat="server" Text="Last Month" Value="LastMonth" />
            <telerik:RadComboBoxItem runat="server" Text="This Year" Value="ThisYear" />
            <telerik:RadComboBoxItem runat="server" Text="All Time" Value="AllTime" />
            <%--<telerik:RadComboBoxItem runat="server" Text="" IsSeparator="true" Value="RadComboBoxItemX1" />--%>
            <telerik:RadComboBoxItem runat="server" Text="Custom..." Font-Bold="true" Value="DateRange" />
        </Items>
        <ExpandAnimation Type="None" Duration="0"></ExpandAnimation>
        <CollapseAnimation Type="None" Duration="0"></CollapseAnimation>
    </telerik:RadComboBox>


function valueChanged(sender, eventArgs) {
                var item = eventArgs.get_item();
                var combo = $find("<%= RadComboBox3.ClientID %>");
                if (sender.get_value()=="DateRange")
                {     
                    combo.clearSelection();                   
                }

[Princy]

Hi Levi,

I guess you want to un-highlight the item in the dropdown when user selects the Item "Custom...". If so you can try out the unHighlight() method for achieving this. Try the following client side code and see whether it helps.

 

JavaScript:

<script type="text/javascript">
function valueChanged(sender, eventArgs)
{
    var item = eventArgs.get_item();
    var combo = $find("<%= RadComboBox3.ClientID %>");
    if (sender.get_value()=='DateRange')
    {
        combo.clearSelection();
        var item = sender.findItemByValue('DateRange').unHighlight();
    }
}
</script>

Thanks,
Princy.