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

Allow user to clear the Combo Box and show the empty message

3 Answers 1169 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 03 Mar 2015, 09:52 PM
I have multiple RadComboBox controls on a page with an empty message. They work great until a user accidentally selects an item and is unable to clear the item so that it shows the empty message again.  As soon as the user leaves the control, it shows the last selection they had.  I would prefer that a user could press the delete or backspace button and have the selection show the empty message as if they had not made a selection.  How do I go about doing that?

3 Answers, 1 is accepted

Sort by
0
Nencho
Telerik team
answered on 06 Mar 2015, 03:29 PM
Hello John,

If the RadComboBox is in ReadOnly mode, the desired functionality could not be achieved as there is no text that could be altered in the input of the control. In this case, I would suggest you to use the DefaultItem of the RadComboBox. Thus you will allow the end user to select it again if he wants to undo his selection.

Here you can find more information on the DefaultItem:

http://www.telerik.com/help/aspnet-ajax/combobox-items-default-item.html

However, if the RadComboBox has is AllowCustomText property set to true, the EmptyMessage should appear, once the text from the input is deleted.

Regards,
Nencho
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
John
Top achievements
Rank 1
answered on 08 Mar 2015, 01:18 PM
The RadComboBox is not set to 'ReadOnly', that wouldn't make sense given the context of my example.  Setting 'AllowCustomText' acts like it allows users to enter whatever they want although I suppose I could write some code to force it to come from the list. 

The default item actually poses as an item, which works but is not a very elegant solution.
0
Nencho
Telerik team
answered on 11 Mar 2015, 04:16 PM
Hello John,

Just to make sure that we are on the same page - the ReadOnly state of the RadComboBox is not disabled state or unavailable for selection. The ReadOnly state would mean that the control does not allow custom text, which would happen if you set the AllowCustomText property to true.

However, you can implement a custom solution for achieving the desired functionality. You can handle the OnClientLoad client-side event of the control in the following manner:

<telerik:RadComboBox runat="server" ID="Combobox1" EmptyMessage="Select" OnClientLoad="onClientLoad">
          <Items>
              <telerik:RadComboBoxItem Text="Item 1" />
              <telerik:RadComboBoxItem Text="Item 2" />
              <telerik:RadComboBoxItem Text="Item 3" />
              <telerik:RadComboBoxItem Text="Item 4" />
              <telerik:RadComboBoxItem Text="Item 5" />
          </Items>
      </telerik:RadComboBox>

<script>
            function onClientLoad(sender) {
                $telerik.$(".rcbInput").on('keyup', function (e) {
                    if (e.keyCode == 46) {
                        sender.clearSelection();
                    }
                })
            }
        </script>

With the above demonstrated approach, you can use the Delete button, in order to clear the selection of the control.

Regards,
Nencho
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
ComboBox
Asked by
John
Top achievements
Rank 1
Answers by
Nencho
Telerik team
John
Top achievements
Rank 1
Share this question
or