LoadOnDemand from Webservice and multiselection

[Andreas Dahlén]

I have a RadComboBox that gets the data from a wcf-webservice.

In OnClientItemDataBound i change the text to be able to show multicolumn data and it works fine.
Now I wants to be able to select multiple items and I don´t know how to do that.

My idea is
I've tried to add a checkbox in OnClientItemDataBound  and I get the checkbox in the dropdown.

var item = e.get_item()
item.set_text('<p class="rcbItemKey"><input type="checkbox">' + item.get_value() + '</p><p class="rcbItemData">'+ item.get_text() + '</p>');

In OnClientBlur I'm will loop through all the items in the dropdown and for each item check if the checkbox is selected.  If it is checked I will add the value of the item to SelecteValue as a ;-separated list.

How do I find the checkbox in OnClientBlur?
Any other idea on how to solve it?
Another problem is that if I select 2 items in the dropdown and close the dropdown and the wants to open it again, the values should be selected.  Is it possible to solve?

[Andreas Dahlén]

I've done some further work and managed to get the functionality in the dropdown. However I can't access  the selectedvalue server-side.

I've got 2 javascript functions (OnClientItemDataBound and OnClientBlur) as seen below.
Server-side I can access the Text property of the ComboBox. But SelectedValue is null. Why isn't SelectedValue set?

function rcbOnClientItemDataBound(sender, e) {
    var item = e.get_item();
    var text = '<p class="multiColumnId"><input type="checkbox" />' + item.get_value() + '</p><p class="multiColumnData">' + item.get_text() + '</p>';
    item.get_attributes().setAttribute('OrginalText', item.get_text());
    item.set_text(text);
}

function rcbOnClientBlur(sender, eventArgs) {
    //get the collection of all items
    var items = sender.get_items();
    var maximumLengthExceeded = false;
    var value = "";
    var text = "";
    var itemText;
    var idInTextBox = sender.get_attributes().getAttribute("IdInTextBox") != undefined;
    var maxLength = sender.get_attributes().getAttribute("MaxLength");
    if (maxLength == undefined)
        maxLength = 40;

    for (var i = 0; i < items.get_count(); i++) {
        var item = items.getItem(i);
        //get the checkbox element of the current item
        var chk = item.get_element().getElementsByTagName("input")[0];
        if (chk.checked) {
            value += item.get_value() + ",";
            if (!maximumLengthExceeded) {
                if (idInTextBox) {
                    itemText = item.get_value();
                } else {
                    itemText = item.get_attributes().getAttribute("OrginalText");
                }
                if (text.length + itemText.length > maxLength) {
                    text = removeLastComma(text);
                    text += "...";
                    maximumLengthExceeded = true;
                } else {
                    text += itemText + ",";
                }
            }
        }
    }
    sender.trackChanges();
    sender.set_value(value);
    sender.set_text(text);
    sender.get_attributes().setAttribute("Values", value);
    sender.commitChanges();
}

[Ivana]

Hi Andreas,

Take a look at the following help articles:

• http://www.telerik.com/help/aspnet-ajax/combobox-usability-checkboxes.html.
• http://www.telerik.com/help/aspnet-ajax/combobox-load-on-demand-access-items-server-side.html.

Generally, load on demand functionality is not supported along with CheckBox feature. Additionally, templates are not supported with WCF service. Yes, you are able to add a HTML as an item's text, but this is a too custom implementation and you need to handle all the different scenarios (selecting items, handling postback, etc) on your own.

Could you elaborate a little bit more on your scenario so that we would be able to offer you a better approach? It would be even better if you could send us a support ticket on this matter.

All the best,
Ivana
the Telerik team

[Andreas Dahlén]

I looked at the help-articles.
We are using version 2011.1.315.35 and cannot in a easy way upgrade to a new version of Telerik due to external dependencies. Hence the first article with built in support for checkboxes in the RadComboBox cannot be used.

The second article (combobox-load-on-demand-access-items-server-side.html) states that both the attributes Text and SelectedValue should be able to access on the server. On the server Text is set, but SelectedValue is always null. Even though I set both values at the same time (during OnClientBlur).

[Ivana]

Hi Andreas,

Yes your observations are right -- the SelectedValue od RadComboBox can be accessed on the server in  load-on-demand scenario, but this is in case when no multiple selection (selecting more than one item) is allowed and there is an item which text matches the text in the input area. Take a look at the following demo: RadComboBox load-on-demand modes; try typing something that does not match any item and click the "Select" button. After clicking the button you will notice that the SelectedValue is nothing since there is no selected item.

The same holds true for your scenario. Since there is no item that matched the text in the input area the selected item is null and therefore there is no SelectedValue of RadComboBox. What I can suggest in this scenario is to use a hidden field where you could save the values of all the clicked items. Then, you would access the value of the hidden field on the server and make the appropriate manipulation to the string being retrieved in order to get the RadComboBox items that correspond to the values from the hidden field. This, however, would be the ideal workaround for a non load on demand scenario.

 In your case this would not work since you are loading the items on demand and in this case the items of RadComboBox are not available on the server and you can not for example loop trough them to find the items which correspond to the values saved in the hidden field.

If I am missing something I suggest that you open a support ticket for this matter where we can elaborate on your scenario in more details.

All the best,
Ivana
the Telerik team