Replacing Checkbox With Dropdown List?

2 posts, 0 answers
  1. Todd
    Todd avatar
    5 posts
    Member since:
    Feb 2012

    Posted 16 Feb 2012 Link to this post

    Is it possible to replace the checkboxes in a checkbox column with dropdown lists or any other control that gives more than just the "on/off" option?

    I want most of the functionality of the checkbox column in that I have data that has a hierarchical relationship and if the parent item is checked, all the child items should be checked as well.   However, I need to be able to choose from more than just "on/off" as provided by the checkbox, I need to be able to select from 3 choices, hence the desire to replace the checkbox with another control such as a dropdown list.

    I created a template column with a dropdown list control in it and figured-out how to set the dropdown list's value on databind.  However, I'm at a loss as to how to get the dropdown lists in the child rows to change to the same value as the parent.  I added a "SelectedIndexChanged" event handler to the dropdown list, but when that fires, I am able to work with the dropdown list that fired the event, but I don't have access to the treelist control and it's rows, so I don't know how to find the dropdown lists in the child rows.

    So far, I've been manipulating the tree list control via server side code (C#) since this is a low traffic Intranet site, so posting back to the server isn't a big issue and I'm hoping that will speed-up my ability to deliver a working solution.

    Any suggestions?
  2. Todd
    Todd avatar
    5 posts
    Member since:
    Feb 2012

    Posted 16 Feb 2012 Link to this post

    I figured-out a solution that works for me.  I replaced the dropdown list with a radio button list because I felt it would be faster for the end user to change.

    Below is ASPX code for the tree list control code with the nested radio button list in a template column. To keep things simple, There is only one column which contains the radio button list.  Note the OnSelectedIndexChanged property set on the radio button list control, as well as the AutoPostBack=true:

    <telerik:RadTreeList 
        ID="RadTreeList1" 
        runat="server" 
        DataSourceID="TreeListXmlDataSource"
        ParentDataKeyNames="parent" 
        DataKeyNames="id" 
        ClientDataKeyNames="quantity" 
        AutoGenerateColumns="False"
        OnItemDataBound="RadTreeList1_ItemDataBound">
        <Columns>
            <telerik:TreeListTemplateColumn 
                DataField="quantity">
                <ItemTemplate>
                    <asp:RadioButtonList 
                        ID="radOnOffDisabled" 
                        runat="server" 
                        AutoPostBack="true" 
                        RepeatDirection="Horizontal"
                        RepeatLayout="Flow" 
                        OnSelectedIndexChanged="radOnOffDisabled_SelectedIndexChanged">
                        <asp:ListItem Text="On" Value="on" />
                        <asp:ListItem Text="Off" Value="off" />
                        <asp:ListItem Text="Disabled" Value="disabled" />
                    </asp:RadioButtonList>
                </ItemTemplate>
            </telerik:TreeListTemplateColumn>
        </Columns>
    </telerik:RadTreeList>

    Below is the code-behind for the radio button list's OnSelectedIndexChanged event handler:

    protected void radOnOffDisabled_SelectedIndexChanged(object sender, EventArgs e)
    {
        // Get reference to the radio button list control.
        RadioButtonList radOnOffDisabled = (RadioButtonList)sender;
        // Get reference to the table cell that the radio button is in.
        TreeListTableCell tableCell = (TreeListTableCell)radOnOffDisabled.Parent;
        // Get reference to the row (TreeListDataItem) that the cell is in.
        TreeListDataItem dataItem = (TreeListDataItem)tableCell.Parent;
        // Get the children of the current row.
        List<TreeListDataItem> children = dataItem.ChildItems;
        // Loop through all the children rows.
        foreach (TreeListDataItem child in children)
        {
            // Get reference to the radio button list in the child rows.
            RadioButtonList radDepartment = (RadioButtonList)child.FindControl("radOnOffDisabled");
            // Set the radio button list's selected value to be the same as the parent's.
            radDepartment.SelectedValue = radOnOffDisabled.SelectedValue;
        }
    }
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top