multiselect + loadondemand

[Patrick Anthamatten]

Working with 2008.2.1001.35

Main Idea : provide the ability to multi select values in radcombobox but allow to loadondemand
Secondary : update the number of selected item, current text is the first selected item in radcombobox

Main problem : on item request, we cannot get selected item"s".

Workaround :

Part 1 : implementing multi select and loadOnDemand at the same time
Tricky parts : rebind each item after getting datasource, binding values are Text and Value (names of radcomboboxitem), which are not the names in the datasource's header.

Aspx

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"
[...]
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
         function StopPropagation(e) {
                e.cancelBubble = true;
                if (e.stopPropagation) {
                    e.stopPropagation();
                }

                var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");

                var combo = $find("<%= multiselectTitle.ClientID %>");
                var newText = "";
                var cnt = 0;
                var items = combo.get_items();
                var first = false;
                var firstItem = "";
                for (var i = 0; i < items.get_count(); i++) {
                    var item = items.getItem(i);
                    var checkbox = item.get_element().getElementsByTagName("input")[0];
                    if (checkbox.checked) {
                        if (first == false) {
                            firstItem = item.get_text();
                            first = true;
                        }
                        newText += item.get_value() + ";";
                        cnt++;
                    }
                }

                ajaxManager.ajaxRequest(newText);
                combo.set_value(newText);
                combo.set_text(firstItem);

                document.getElementById("ctl00_contentPlaceHolder_div_count").innerHTML = cnt;
            }
[...]

<div id="div_count" runat="server">0</div>

[...]

<telerik:RadComboBox ID="multiselectTitle" runat="server" EnableLoadOnDemand="true" AutoPostBack="false" DataTextField="Title" DataValueField="Id" OnItemsRequested="multiselectTitle_ItemsRequested">
    <ItemTemplate>
        <div id="div1" onclick="StopPropagation(event)">
            <asp:CheckBox ID="chkBoxPrdTitle" runat="server" value='<%# DataBinder.Eval(Container, "Value") %>' />
                <asp:Literal ID="litPrdTitle" runat="server" Text='<%# DataBinder.Eval(Container, "Text") %>'></asp:Literal>
        </div>
    </ItemTemplate>
</telerik:RadComboBox>

[...]

Code behind

private void resetSelectedPrdIds()
    {
        Session["selectedPrdIds"] = null;
        div_count.InnerHtml = "0";
        multiselectTitle.Text = "";
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            resetSelectedPrdIds();
        }
    }

    protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    {
        string[] values = e.Argument.Split(';');

        List<int> ids = new List<int>();
        foreach (string value in values)
        {
            try { ids.Add(int.Parse(value)); }
            catch { }
        }
        Session["selectedPrdIds"] = ids;
    }


    protected void multiselectTitle_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
    {
        RadComboBox comboBox = (RadComboBox)sender;

        List<int> selectedPrdIds = new List<int>();
        if (Session["selectedPrdIds"] != null)
            selectedPrdIds = (List<int>)Session["selectedPrdIds"];

        var itemObjects = from items in myDataContext
                                         where (SqlMethods.Like(items.title, e.Text + "%") ||
                                                     (from vals in selectedPrdIds select vals).Contains(items.id))
                                         select new { Id = items.id, Title = items.title };

        foreach(var io in itemObjects)
        {
              comboBox.Items.Add(new RadComboBoxItem(io.Title, io.Id.ToString()));
        }

        RadComboBoxItemCollection rcbic = multiselectTitle.Items;
        foreach (RadComboBoxItem item in rcbic)
        {
            if (selectedPrdIds.Contains(int.Parse(item.Value)))
            {
                ((CheckBox)item.FindControl("chkBoxPrdTitle")).Checked = true;
            }
            item.DataBind();
        }
    }

Feel free to comment above code

joa