Click here to Skip to main content
Click here to Skip to main content

Load page in IFRAME based on TreeView node selection

By , 8 Mar 2011
 
This is helpful when you are using TreeView and IFRAME and you want to load a page in IFRAME according to selected value from TreeView.
 
.aspx
<asp:TreeView ID="TreeView1" class="leftpaneltree" runat="server" ImageSet="Arrows"
                                        NodeIndent="7" ExpandDepth="0">
                                        <HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />
                                        <Nodes>
                                            <asp:TreeNode Text="User" Value="User" NavigateUrl="User/Users.aspx"
                                                 Value="">
                                                <asp:TreeNode Text="Admin" Value="Admin" NavigateUrl="User/Admin.aspx">
                                                </asp:TreeNode>
                                                <asp:TreeNode Text="User" Value="User" NavigateUrl="User/User.aspx">
                                                </asp:TreeNode>
                                            </asp:TreeNode>
                                            <asp:TreeNode NavigateUrl="Department/Department.aspx" Text="Department"
                                                Value="Department">
                                                <asp:TreeNode NavigateUrl="Department/Sales.aspx" Text="Sales"
                                                    Value="Sales"></asp:TreeNode>
                                                <asp:TreeNode NavigateUrl="Department/Purchase.aspx" Text="Purchase"
                                                    Value="Purchase"></asp:TreeNode>
                                                <asp:TreeNode NavigateUrl="Department/Marketing.aspx" Text="Marketing"
                                                    Value="Marketing"></asp:TreeNode>
                                            </asp:TreeNode>
                                        </Nodes>
                                        <NodeStyle Font-Names="Tahoma" Font-Size="10pt" ForeColor="Black" HorizontalPadding="2px"
                                            NodeSpacing="0px" VerticalPadding="0px" />
                                        <ParentNodeStyle Font-Bold="False" />
                                        <SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px"
                                            VerticalPadding="0px" />
                                    </asp:TreeView>
 <script language="javascript" type="text/javascript">
        assignTreeNodeEvent();
        function assignTreeNodeEvent() {
            var tree = document.getElementById('<%=TreeView1.ClientID %>');
            var nodes = tree.getElementsByTagName('a');
            for (var n = 0; n < nodes.length; n++) {
                var url = nodes[n].getAttribute('href');
                if (url.indexOf(".aspx") > 3) {
                    nodes[n].setAttribute('href', '#');
                    var strclick = "changePage('" + url + "')";
                    nodes[n].setAttribute('onclick', strclick);
                }
            }
        }
        function changePage(sTargetPage) {
            var frmPage = document.getElementById('iframeName');
            frmPage.src = sTargetPage;
        }
    </script>

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Sunasara Imdadhusen
Software Developer (Senior) Infostretch Ahmedabad-Gujarat
India India
Member
Aspiring for a challenging carrier wherein I can learn, grow, expand and share my existing knowledge in meaningful and coherent way.

sunaSaRa Imdadhusen
 
AWARDS:
  1. 1st Best Asp.Net article of SEP 2010
  2. 2nd Best Asp.Net article of MAY 2011
 
Read More Articles...

Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board.
Search this forum  
    Spacing  Noise  Layout  Per page   
GeneralHi! thank you. But a question. This part no found in IE. ...memberfense9 Feb '12 - 9:03 
Hi! thank you.
 
But a question.
 
This part no found in IE.
 
var strclick = "changePage('" + url + "')";
nodes[n].setAttribute('onclick', strclick);
 
I try with:
 
nodes[n].onclick = function () { var frmPage = document.getElementById('frame1'); frmPage.src = strclick; };
 
But, no found again.
 
This problem is in IE.

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Permalink | Advertise | Privacy | Mobile
Web03 | 2.6.130523.1 | Last Updated 8 Mar 2011
Article Copyright 2011 by Sunasara Imdadhusen
Everything else Copyright © CodeProject, 1999-2013
Terms of Use
Layout: fixed | fluid