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

RadGrid and RadTreeView combined

7 Answers 104 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jon
Top achievements
Rank 1
Jon asked on 30 Apr 2009, 09:28 AM
Hi,

I'm looking to do a user configuration page that is somewhat complex and would like some advice on if it is possible with the Rad controls as they are now.

I want to have a treeview showing a location heirarchy on the left that the user can drill down into.  On each drilled down row I'd like to see several columns representing options for each - something like the following. Note that each circle is a checkbox NOT a radio button - I couldn't find a square on the keyboard ;)

---------------------------Option 1 ----------- Option 2 --------------- Option 3 -----
O America                      O                           O                                O
    O New York                O                           O                                O
    O Boston                    O                           O                                O
    O Miami                      O                           O                                O
O England                      O                           O                                O
    O London                   O                           O                                O
    O Bristol                      O                           O                                O
    O Newcastle                O                           O                                O

What I'd like to do is then allow for the user to click the parent level and have it's setting cascade to the children ie someone clicks America Option 1, all of the cities in America would then be ticked for Option 1.  Then for Option 2, just Boston gets a tick.

Please tell me this is possible (and hopefully easy to do).  It will make my life a lot easier if it is possible!

If not possible then I'll probably get around it by having an option drop down above a tree view and you choose the option to work on one at a time.

Regards,

Jon

7 Answers, 1 is accepted

Sort by
0
Sebastian
Telerik team
answered on 30 Apr 2009, 09:50 AM
Hello Jon,

This type of treelist presentation can be achieved either with RadTreeView using templates or utilizing the self-referencing hierarchy feature of RadGrid. I hope that one of these options is feasible for your scenario.

Best regards,
Sebastian
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Jon
Top achievements
Rank 1
answered on 30 Apr 2009, 10:08 AM
Hi Sebastian,

Sounds good - just wish there was an exact match for me to copy ;)  Very lazy of me I know.

With the grid, is there a way to turn on in row edit for all rows by default?  Then I can have the page load straight to the edit functionality.  If I have to turn on edit for each row from the browser then I think I'll go for the tree view option.

Regards,

Jon
0
Sebastian
Telerik team
answered on 30 Apr 2009, 10:15 AM
Hello Jon,

You can use EditMode = InPlace for the self-referencing grid and switch all items in edit mode initially with the approach presented here. The other option is to use RadTreeView with templates if you prefer it.

Best regards,
Sebastian
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Jon
Top achievements
Rank 1
answered on 08 May 2009, 08:27 AM
Hi Sebastian,

I managed to get the treeview code working to great effect however when I tried to have more that one checkbox per node they seemed to act more like radio buttons than checkboxes, ie you click the second one and the check disappears from the first.  This was true even when using the template approach.

Do you have a basic sample where you have more than one checkbox per tree node?

Many thanks,

Jon
0
Atanas Korchev
Telerik team
answered on 08 May 2009, 12:25 PM
Hi Jon,

Could you please provide more details about your implementation? Why do you need two checkboxes per node? Ideally you could send some sample code by pasting it here.

Sincerely yours,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Jon
Top achievements
Rank 1
answered on 08 May 2009, 02:11 PM
Hi Albert,

The top post in this thread explains the reason that I need multiple checkboxes per node.  Essentially it's intended to make configuration of various options and security permissions a basic task. 

I've done the attached sample (VB top and ASPX bottom). 

In the example I turned off the default checkbox to the left of the template and that is what the problem is.  When turned on, each click on a templated checkbox toggles the main checkbox.

I can live without the main checkbox if I can replicate the cascading check functionality for normal checkboxes (as demoed here), 

Essentially from the sample below I will need to ensure that if you click the checkbox1 in the Sample 1 node, the check cascades to Sample 1 Child 1 and Sample 1 Child 2.

Finally if I were then to manually uncheck the Sample 1 Child 2 checkbox1 box it would then make the Sample 1 node show a tri state checkbox (indicating some children but not all are checked).

Any thoughts?

Regards,

Jon


 Private Sub GenerateTreeView()  
        ' parent node  
        Dim sampleRadTreeNode As RadTreeNode = New RadTreeNode()  
        sampleRadTreeNode.NodeTemplate = New NodeTemplate("Sample 1")  
        ' child node  
        Dim sampleChildRadTreeNode As RadTreeNode = New RadTreeNode()  
        sampleChildRadTreeNode.NodeTemplate = New NodeTemplate("Sample 1 Child 1")  
        sampleRadTreeNode.Nodes.Add(sampleChildRadTreeNode)  
        ' child node  
        sampleChildRadTreeNode = New RadTreeNode()  
        sampleChildRadTreeNode.NodeTemplate = New NodeTemplate("Sample 1 Child 2")  
        sampleRadTreeNode.Nodes.Add(sampleChildRadTreeNode)  
        uxRadTreeView.Nodes.Add(sampleRadTreeNode)  
        ' parent node  
        sampleRadTreeNode = New RadTreeNode()  
        sampleRadTreeNode.NodeTemplate = New NodeTemplate("Sample 2")  
        uxRadTreeView.Nodes.Add(sampleRadTreeNode)  
        uxRadTreeView.DataBind()  
    End Sub 
 
    Class NodeTemplate  
        Implements ITemplate  
        Public text As String 
        Public level As Integer 
 
        Public Sub New(ByVal text As String)  
            Me.text = text  
        End Sub 
 
        Public Sub InstantiateIn(ByVal container As Control) Implements System.Web.UI.ITemplate.InstantiateIn  
            Dim table As Table = New Table()  
            table.CssClass = "NodeTemplateCSS" 
            table.CellPadding = 0  
            table.CellSpacing = 0  
 
            Dim tableRow As TableRow = New TableRow()  
            Dim tableTextCell As TableCell = New TableCell()  
 
            Dim nodeText As Label = New Label()  
            nodeText.ID = "ItemLabel" 
            nodeText.Text = text  
            tableTextCell.Controls.Add(nodeText)  
 
            Dim checkbox1Cell As TableCell = New TableCell()  
            Dim checkbox1 As CheckBox = New CheckBox()  
            checkbox1.ID = "checkbox1" 
            checkbox1Cell.Controls.Add(checkbox1)  
 
            Dim checkbox2Cell As TableCell = New TableCell()  
            Dim checkbox2 As CheckBox = New CheckBox()  
            checkbox2.ID = "checkbox2" 
            checkbox2Cell.Controls.Add(checkbox2)  
 
            tableRow.Cells.Add(tableTextCell)  
            tableRow.Cells.Add(checkbox1Cell)  
            tableRow.Cells.Add(checkbox2Cell)  
            table.Rows.Add(tableRow)  
            container.Controls.Add(table)  
        End Sub 
    End Class 

<body> 
    <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="uxRadScriptManager" runat="server"></telerik:RadScriptManager> 
        <telerik:RadTreeView ID="uxRadTreeView" runat="server"   
                TriStateCheckBoxes="True" CheckChildNodes="True">  
         </telerik:RadTreeView>         
        <telerik:RadFormDecorator ID="uxRadFormDecorator" Runat="server" DecoratedControls="All" />                  
    </form> 
</body> 




0
Veselin Vasilev
Telerik team
answered on 11 May 2009, 02:15 PM
Hi Jon,

I suggest that you temporary remove the RadFormDecorator and enable the checkbox support (CheckBoxes="True"). Let me know if it works as you expect.

Best wishes,
Veselin Vasilev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Grid
Asked by
Jon
Top achievements
Rank 1
Answers by
Sebastian
Telerik team
Jon
Top achievements
Rank 1
Atanas Korchev
Telerik team
Veselin Vasilev
Telerik team
Share this question
or