RadCombobox with checkboxes

4 posts, 0 answers
  1. Mani PC
    Mani PC avatar
    73 posts
    Member since:
    Jul 2009

    Posted 30 Mar 2013 Link to this post

    i have a combobox with checkboxes...

    i need a javascript that will check/uncheck all items in the list....

    here is my markup...

    ------------------------------------------------

     

    <telerik:RadComboBox ID="cmbDeptDCVL" runat="server" AllowCustomText="false" HighlightTemplatedItems="True" Width="100"

     TabIndex="6" DropDownWidth="320px" >

     <HeaderTemplate>

     <table>

     <tr>

     <td width="20">

     <asp:CheckBox ID="chkAllDCVL" runat="server" ToolTip="Select/Deselect All" Text="" />

     </td>

     <td width="80"> Dept </td>

     <td width="220">Description </td>

     </tr>

     </table>

     </HeaderTemplate>

     <ItemTemplate>

     <table>

     <tr align="left">

     <td width="20">

     <asp:CheckBox runat="server" ID="chkSingleDCVL" Text="" />

     </td>

     <td width="80" align="left"> <%#CType(Container.DataItem, PhysicalInventory.Models.ApplCompStructInfo).DeptId%> </td>

     <td width="220" align="left"> <%#CType(Container.DataItem, PhysicalInventory.Models.ApplCompStructInfo).DeptShortDesc%> </td>

     </tr>

     </table>

     </ItemTemplate>

      

    <CollapseAnimation Duration="200" Type="OutQuint" />

     </telerik:RadComboBox>

     -----------------

    any help

    Thanks

  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 01 Apr 2013 Link to this post

    Hi,

    Please try the following JavaScript code.

    JavaScript:
    <script type="text/javascript">
        function pageLoad() {
            var combobox = $find('<%=cmbDeptDCVL.ClientID %>');
            var items = combobox.get_items();
            var itemCount = items.get_count()
            for (var counter = 0; counter < itemCount; counter++) {
                var item = items.getItem(counter);
                item.set_checked(true)
            }
        }
    </script>

    Thanks,
    Princy.
  3. Mani PC
    Mani PC avatar
    73 posts
    Member since:
    Jul 2009

    Posted 01 Apr 2013 Link to this post

    Thanks.

    My combobox is placed inside RadPanelBar control.... Any idea?

     <telerik:RadPanelBar runat="server" ID="rpbReconciliationSummaryInquiry" Height="300"  

    Font-Bold="True" Font-Size="Large" ExpandMode="SingleExpandedItem" OnClientItemExpand="OnClientItemExpand" 

    Width="300" EnableViewState="False">

     <Items>  

    <telerik:RadPanelItem Expanded="False" Text="Dept / Class / Vendor / Location" Value="DCVLTop" Font-Bold="True" ForeColor="White">

     <Items>  

    <telerik:RadPanelItem Value="DCVL" Text=""> 

    <ItemTemplate>  

    <table> 

    <tr>
    <td> 

    <asp:Label ID="lblDept" runat="server" Text="Dept:" CssClass="label" />

     </td> 

    <td>
    <telerik:RadComboBox ID="cmbDeptDCVL" runat="server" AllowCustomText="false" HighlightTemplatedItems="True" Width="100"

     TabIndex="6" DropDownWidth="320px">

     <HeaderTemplate>  

    <table> 

    <tr>  

    <td width="20"> 

    <asp:CheckBox ID="chkAllDeptDCVL" runat="server" ToolTip="Select/Deselect All" Text="" OnCheckedChanged="ToggleAllItemsDeptDCVL" AutoPostBack="True" /> 

    </td> 

    <td width="80"> Dept </td>  

    <td width="220">Description </td> 

    </tr>  

    </table

    </HeaderTemplate>  

    <ItemTemplate> 

    <table> 

    <tr align="left"> 

    <td width="20">  

    <asp:CheckBox runat="server" ID="chkSingleDeptDCVL" Text="" OnCheckedChanged="ToggleSelectedItemsDeptDCVL" AutoPostBack="True" />

     </td>  

    <td width="80" align="left"> <%#Eval("DeptId")%></td> 

    <td width="220" align="left"> <%#Eval("DeptShortDesc")%></td>  

    </tr> 

    </table>  

    </ItemTemplate> 

    <CollapseAnimation Duration="200" Type="OutQuint" />  

    </telerik:RadComboBox> 

    </td>  

    </tr>

     

  4. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 03 Apr 2013 Link to this post

    Hi Mani,

    When RadComboBox is nested inside other container $find('<%=cmbDeptDCVL.ClientID %>') will throw a compile time error in VS. Use Telerik.Web.UI.RadComboBox.ComboBoxes[0] instead. Telerik.Web.UI.RadComboBox.ComboBoxes returns collection of all combos on the page and you can get the one you need. Then the Princy's code will be as follows:
    function pageLoad() {
        //Get the first combo
        var combobox = Telerik.Web.UI.RadComboBox.ComboBoxes[0];
        var items = combobox.get_items();
        var itemCount = items.get_count()
        for (var counter = 0; counter < itemCount; counter++) {
            var item = items.getItem(counter);
            item.set_checked(true)
        }
    }


    Regards,
    Hristo Valyavicharski
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top