Combobox with Checkboxes Disable

[Richard Maly]

Hi

I have created a combobox with checkboxes in it

 <telerik:RadComboBox ID="cboMonth" runat="server" OnClientDropDownClosed="onClientDropDownClosed">
        <ItemTemplate>
             <asp:CheckBox runat="server" ID="chk1" Checked="true"  Text='<%# DataBinder.Eval(Container, "Text") %>' />
        </ItemTemplate>
</telerik:RadComboBox>

which works a treat however when I try enable or disable it using Javascript

                if (item._text = " ") {
                    cboCountries.enable()
                }
                else {
                    cboCountries.clearSelection()
                    cboCountries.disable();
                }

When it is re-enabled the checkboxes are disabled and you I can not select them

I have tried manually setting the checkboxes disabled = false

 var items = cboCountries.get_items();
                    for (var i = 0; i < items.get_count(); i++) {

                        var chk1 = $get(cboCountries.get_id() + "_i" + i + "_chk1");
                        chk1.disabled = false;
                    }

but this is not working either.

Anyone have any ideas?

TIA
Richard

[Kalina]

Hi Richard Maly,

Your approach looks correct - you can enable/disable RadComboBox with enable() and disable() client-side methods. There must be something else that causes the issue.

Are there any client-side errors at your page?
At what event you are trying to enable or disable the control?
Could you please paste the full code of your page here?

Thank you in advance.

All the best,
Kalina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Richard Maly]

Hi,

As I had to move on I removed the code, when I re-added it worked properly.  So I figure there must have been a typo in my code

Thanks for your help.
Richard

[Rod]

Hi,

I have been able to reproduce the issue with your treeviewcombobox demo example below:
"http://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/treeviewcombobox/defaultvb.aspx?product=combobox".

I added the following code just before declaring the RadComboBox1 (right above the text "Destination:"):

<script type="text/javascript">
    function updateCombo(isChecked) {
        var strComboId = 'RadComboBox1';
        var comboBox = $find(strComboId);

        if (isChecked)
            comboBox.enable();
        else
            comboBox.disable();
    }

</script>
<asp:CheckBox ID="chkAssignTo" Runat="server" CssClass="label" Checked="true" Text="Enable selection" OnClick="JavaScript:updateCombo(this.checked);"></asp:CheckBox><br />

Destination:
<%--Declaration of RadComboBox1--%>

Steps to reproduce:
1. Uncheck the "Enable selection" checkbox - it should disable the combo
2. Now check the "Enable selection" checkbox - it should enable the combo
3. Now select an item from the treeview inside the combo - the selected item is set as the combo text
4. Now try to select a different item - you can't... as the treeview has disappeared!

Please let us know if there's something that I'm missing or if there's a workaround to this issue.  Thanks.

[Rod]

In addition, if you disable the "RadComboBox1" (i.e. Enabled="False") and set the checked property of the checkbox to "false" you will see strange behaviour much like the one described in the forum re CheckBoxCombo. 

All the treeview items become disabled even after the checkbox is checked and you are not able to expand/collapse the nodes and the treeview disappears after selecting a node.

[Kalina]

Hello Rod,

The scenario that you try to implement is rather custom.

When you enable the RadComboBox at client-side – please enable the RadTreeView and its nodes as well.   Additionally - if you set the text of the first item of the RadComboBox - in fact you “replace” the RadTreeView.
 
In order to make the RadComboBox “remember” the selected text please set the AllowCustomText property of the control to “true” then at OnClientLoad event you can forbid user typing in the control input in this way:

function onLoad(sender) {
sender.get_inputDomElement().readOnly = "readonly";

if (document.getElementById("<%= chkAssignTo.ClientID %>").checked) {
    var comboBox = $find("<%=RadComboBox1.ClientID %>");

    comboBox.enable();

    var treeView = comboBox.get_items().getItem(0).findControl("RadTreeView1");
    treeView.set_enabled(true);
    var nodes = treeView.get_allNodes();
    for (var i = 0; i < nodes.length; i++) {
        nodes[i].set_enabled(true);

    }
}
}

Please find more details at the sample attached.

Best wishes,
Kalina
the Telerik team