2/09/2010

Multiple Selection in RadComboBox--- Getting selectedValue at server side-- Setting selected value javascript

This article shows how to select multiple items in radcombobox and to get these selected values at server side. Also it shows how to show selected value in radcombobox using javascript.

1.First of all declare radcombobox.


<telerik:RadComboBox ID="ddlVehicleOwners" OnClientSelectedIndexChanging="onSelectedIndexChangingVehicleOwner" runat="server" Skin="WebBlue" OnClientDropDownClosed="HandleClose" LoadingMessage="Loading..." >
                                            <ItemTemplate>
                                                <table width="100%" cellpadding="0" cellspacing="0">
                                                    <tr>
                                                        <td width="5%">
                                                            <asp:CheckBox ID="CheckBox" runat="server" Text='<%# Eval("DataFieldName") %>' />
                                                        </td>
                                                        <td align="left">
                                                            <asp:Label ID="lblVName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"DataFieldName") %>'
                                                                Visible="false"></asp:Label>
                                                        </td>
                                                    </tr>
                                                </table>
                                            </ItemTemplate>
                                        </telerik:RadComboBox>

The label visible is false because it will have the text representing the id of that record.


2. Now in the head portion of the page use javascript to show selectedvalues in the radcombobox.



function HandleClose(comboBox)
        {
            var selectedData = "";
            var items = comboBox.get_items();
            for (var i = 0; i < items.get_count(); i++)
            {
                var itemDiv = items.getItem(i).get_element();
                var inputs = itemDiv.getElementsByTagName("input");
                var inputsData = itemDiv.getElementsByTagName("label");
                for (var inputIndex = 0; inputIndex < inputs.length; inputIndex++)
                {
                    var input = inputs[inputIndex];
                    if (input.type == "checkbox")
                    {
                        if (input.checked == true)
                            selectedData = selectedData + inputsData[inputIndex].innerText+",";
                    }
                }
            }
            comboBox.set_text(selectedData.substring(0, selectedData.length - 1));
        }



3. Now final step to get values at server side.


foreach (RadComboBoxItem item in ddlVehicleOwners.Items)
            {
                CheckBox checkBox = (CheckBox)item.FindControl("CheckBox");
                if (checkBox.Checked)
                {
                    Label label = (Label)item.FindControl("lblVName");
                   text=label.text;
                }

            }


The text will contain the value of that selected item.


3 comments:

Post a Comment

Twitter Delicious Facebook Digg Favorites More