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

Problem with Load On Demand Multi Select Combo box Implementation

1 Answer 79 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Jerry
Top achievements
Rank 1
Jerry asked on 11 Jun 2013, 01:52 PM
HTML:
  <telerik:RadComboBox EnableScreenBoundaryDetection="false" ID="cbxSearch"
                    runat="server" AllowCustomText="True" EmptyMessage="" EnableLoadOnDemand="True"
                    EnableVirtualScrolling="True" Height="200px" HighlightTemplatedItems="True" MarkFirstMatch="False"
                    OnClientItemsRequesting="OnClientItemsRequesting" ShowMoreResultsBox="True" ShowToggleImage="False"
                    >
                    <HeaderTemplate>
                        <table id="Table1"  runat="server">
                            <tr>
                                <td > </td> 
                                <td"> Name </td>
                                <td > FName</td>
                                <td > LName </td>
                            </tr>
                        </table>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <table style="width: 100%; text-align: left"  onclick="StopPropagation(event)">
                            <tr>
                                <td style="width: 15px">
                                  <asp:CheckBox runat="server" ID="chk"  onclick="onCheckBoxClick(this)" />
                                </td> 
                                <td style="width: 75px">
                                    <%#DataBinder.Eval(Container.DataItem, "name")%>
                                </td>
                                <td style="width: 75px">
                                    <%#DataBinder.Eval(Container.DataItem, "fname")%>
                                </td>
                                <td style="width: 75px">
                                    <%#DataBinder.Eval(Container.DataItem, "lname")%>
                                </td>
                            </tr>
                        </table>
                  </ItemTemplate>
            </telerik:RadComboBox>

Server Side Code:

   Protected Sub cbxSearch_ItemsRequested(ByVal sender As Object, ByVal e As RadComboBoxItemsRequestedEventArgs RadComboBoxItemsRequestedEventArgs) Handles cbxSearch
.ItemsRequested

  
            Dim lstUsers =  DatabaseCall(e.Text,  e.NumberOfItems + 1, e.NumberOfItems + 100)

            If lstUsers.Count < 100Then
                  e.EndOfItems = True
            Else
                  e.EndOfItems = False
            End If
         
            Try
                cbxSearch.Datasource= lstUsers
                cbxSearch.DataBind()
            Catch
                e.Message = "No matches"
            End Try

        End Sub

  
        Protected Sub cbxSearch_ItemDataBound(ByVal sender As Object, ByVal e As RadComboBoxItemEventArgs) Handles cbxSearch.ItemDataBound
            e.Item.Text = (DirectCast(e.Item.DataItem, user)).name
            e.Item.Value = (DirectCast(e.Item.DataItem,user)).Id.ToString()
        End Sub
   
Js:
   function onCheckBoxClick(chk) {
    var combo = $find(cbxSearch);
    var selectedItems = $("hdField");
    var text = "";
    var selectedIds = "";
    var items = combo.get_items();
    for (var i = 0; i < items.get_count(); i++) {
        var item = items.getItem(i);
        var chk = $get(combo.get_id() + "_i" + i + "_chk");
        if (chk.checked) {
            text += item.get_text() + ",";
            selectedIds += item.get_value() + ",";
        }
    }
    text = text.replace(/,$/, "");
    userinfoIds = selectedIds.replace(/,$/, "");
    combo.set_text(text);
    selectedItems.value = selectedIds;
}

With the help of this tutorial http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/templates/defaultcs.aspx

I was able to build multi column multi select combobox with load on demand. 
But i am facing a problem when I scroll down in the combobox to get next 100 items from the database, im able to bind next 100 items to combobox but the client Ids of checkboxes are same as previous 100 .
    var chk = $get(combo.get_id() + "_i" + i + "_chk");

So im not able to figure out which items are selected.


Any help will be appreciated.

Thanks




1 Answer, 1 is accepted

Sort by
0
Jerry
Top achievements
Rank 1
answered on 11 Jun 2013, 03:50 PM
Tags
ComboBox
Asked by
Jerry
Top achievements
Rank 1
Answers by
Jerry
Top achievements
Rank 1
Share this question
or