Internet.com - The Network for Technology Professionals

Premier Club Log In/Registration

TODAY'S HEADLINES | ARTICLE ARCHIVE | SKILLBUILDING | TIP BANK | SOURCEBANK | FORUMS | NEWSLETTERS

Specialized Dev Zones

Vendor Solutions

eBook Library NEW

Special Reports

10-Minute Solutions

DevXtra Editors' Blog

Download the code for this article

Cascading Style Sheet (CSS1) Reference

All DHTML 10-minute Solutions

All Web Development 10-minute Solutions

Encapsulate Your JavaScript: Keep Private Methods Private

Build A JavaScript Tree Control

DevX: Web Development Zone

This article shows you one way to use object-oriented JavaScript programming applied to an HTML-based Tree control. Can you think of other ways? Do you think people are better off "rolling their own" solutions or using one of the available client-side JavaScript-based UI frameworks? Let us know in the web.dhtml.general discussion group.

Partners & Affiliates

Average Rating: 4.3/5 | Rate this item | 18 users have rated this item.

Build an Object-Oriented Tree Control Using JavaScript

When you need to display hierarchical information in your Web pages, build this Explorer-like tree control by creating only three polymorphic JavaScript objects.

by Tom Duffy

November 8, 2002

n my last article, I demonstrated how to build an Explorer-like tree control using JavaScript. This month's installment focuses on converting the tree control to an object-oriented structure. Such a tree control should be both reusable and easily extended.

How do I build an Explorer-like tree control that is easily extended using object-oriented principles?

Take advantage of JavaScript's polymorphic abilities and the solution is a snap.

Next Page: JavaScript and Polymorphism

Download The Code for this Article

Page 1: Introduction	Page 4: Set up the Branch Object
Page 2: JavaScript and Polymorphism	Page 5: Set up the Leaf Objects
Page 3: Set up the Tree Object	Page 6: Build the Tree

Advertising Info | Member Services | Permissions | Contact Us | Help | Feedback | Site Map | Network Map | About

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

Whitepapers and eBooks

Adobe Article: Adobe Helps PHP Developers Create Rich Internet Applications
Adobe Article: Java Developers Finding a Home at Adobe Flex
IBM Articles: A Smarter Business Needs Smarter Technology
Intel Xeon Processor Increases Server Efficiency and Capabilities
Intel Tech Brief: Automated Energy Efficiency for the Intelligent Enterprise
Oracle Whitepaper: Using Oracle In-Memory Database Cache to Accelerate the Oracle Database
Oracle Whitepapers - Innovation for IT Leaders
Avaya Article: Communication-Enabled Mashups--Empowering Both Business Owners and IT

Internet.com eBook: IT Manager's Guide to Social Networking
Internet.com eBook: Get Ready for Windows 7
Microsoft Article: Expression Web 3--New Features for PHP Developers
Whitepapers: Manage Your Business Infrastracture with IBM
Whitepaper: Maximize Your Storage Investment with HP
Internet.com eBook: Becoming a Better Project Manager
Microsoft Article: Stress Free and Efficient Designer/Developer Collaboration
MORE WHITEPAPERS, EBOOKS, AND ARTICLES

Webcasts

Webcast: Connecting PHP to Microsoft Technologies
Video: Microsoft Partner Program Benefits
Video: Windows Azure Debugging Tips
SAP BusinessObjects Webcast: Unlock the Power of Reporting with Crystal Reports

IBM Webcast: Speed Business Innovation with Reduced Cost and Risk
Video: Deploy Applications on Windows Azure
MORE WEBCASTS, PODCASTS, AND VIDEOS

Downloads and eKits

Downloads & Free Trials: Microsoft's New Efficiency Resource Center
Get the Windows 7 SDK
Free Trial: Red Gate SQL Backup Pro 6

Iron Speed Designer Application Generator
MORE DOWNLOADS, EKITS, AND FREE TRIALS

Tutorials and Demos

Virtual Lab: Migrating PHP Applications
Enabling Web Slices and Accelerators with a PHP Site
Internet.com Hot List: Get the Inside Scoop on the Hottest IT and Developer Products

All About Botnets
MORE TUTORIALS, DEMOS AND STEP-BY-STEP GUIDES