Clear button on RadCombBox

[Alex]

 

Is there a way to clear a multi check rad combo box without postback or is there a clear button already built into the control? 

Alex

[Rumen]

Hi Alex,

Thank you for your question!

Here is a sample which you can use:

 

<script type="text/javascript">
    function Uncheck() {
        var combo = $find("<%=RadComboBox1.ClientID %>");
        var items = combo.get_checkedItems();

        var i = 0;
        while (i < items.length) {
            items[i].uncheck();
            i++;
        }
    }
</script>
<telerik:RadComboBox ID="RadComboBox1" runat="server" EmptyMessage="check items"
    CheckBoxes="true" EnableCheckAllItemsCheckBox="true">
    <Items>
        <telerik:RadComboBoxItem Text="item 1" Value="1" />
        <telerik:RadComboBoxItem Text="item 2" Value="2" />
        <telerik:RadComboBoxItem Text="item 3" Value="3" />
        <telerik:RadComboBoxItem Text="item 4" Value="4" />
    </Items>
</telerik:RadComboBox>
<asp:Button ID="Button1" runat="server" OnClientClick="Uncheck()" Text="Uncheck" />

You can find more details at How to reset RadComboBox with Checkboxes using Javascript.

Please try the solution and share your feedback with me.

Best Regards,
Rumen
Progress Telerik

[Alex]

Hi Rumen

I have try this but it still posting back. 

The clear button is within the combo box (see the code below) , could this be causing a problem with the post back? 

 function ClearElementType() {
           var combo = $find("<%=rcmbElementType.ClientID %>");
           var items = combo.get_checkedItems();

           var i = 0;
           while (i < items.length) {
               items[i].uncheck();
               i++;
           }
        }

<telerik:RadComboBox ID="rcmbElementType" runat="server" Skin="Bootstrap" Width="280px" DataSourceID="sdsElementType" DataValueField="ElementType" DataTextField="ElementType"  EmptyMessage="Select a Element Type" OnItemDataBound="rcmbElementType_ItemDataBound" CheckBoxes="true"   >
                                                         <HeaderTemplate> 
                                                              <asp:Button ID="lnkClearCombBox" runat="server" Text="Clear"   OnClientClick="ClearElementType()" UseSubmitBehavior="false" AutoPostBack="false"/>
                                                        </HeaderTemplate>
                                                    </telerik:RadComboBox>

Alex

[Rumen]

Hi Alex,

Set return false after the function call to cancel the postback:

<script>
    function ClearElementType() {
        var combo = $find("<%=rcmbElementType.ClientID %>");
        var items = combo.get_checkedItems();

        var i = 0;
        while (i < items.length) {
            items[i].uncheck();
            i++;
        }
        return false;
    }
</script>
<telerik:RadComboBox ID="rcmbElementType" runat="server" Skin="Bootstrap" Width="280px" EmptyMessage="Select a Element Type" CheckBoxes="true">
    <HeaderTemplate>
        <asp:Button ID="lnkClearCombBox" runat="server" Text="Clear" OnClientClick="ClearElementType();return false" UseSubmitBehavior="false" AutoPostBack="false" />
    </HeaderTemplate>
    <Items>
        <telerik:RadComboBoxItem Text="item 1" Value="1" />
        <telerik:RadComboBoxItem Text="item 2" Value="2" />
        <telerik:RadComboBoxItem Text="item 3" Value="3" />
        <telerik:RadComboBoxItem Text="item 4" Value="4" />
    </Items>
</telerik:RadComboBox>

Regards,
Rumen
Progress Telerik

[Alex]

Hi Rumen 

 

That has worked

Thanks

Alex

[Rumen]

You are welcome, Alex! Keep up the good work.

Regards,
Rumen
Progress Telerik