+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Displaying hierarchical data with HTML. (/showthread.php?tid=17395)
Displaying hierarchical data with HTML. - El Forum - 04-03-2009
[eluser]TheFuzzy0ne[/eluser]
Hi, all.
A friend has asked me the best way to display hierarchical data on a Web page, but alas, I do not know the answer!
What would like to display, units, which are made up from modules, which are made up by lessons.
So the structure is like thus:
Code:
UNIT 1 - Description of unit
|
+- Module 1 - Description of module
| |
| +- Lesson 1: Description of lesson
| +- Lesson 2: Description of lesson
| +- Lesson 3: Description of lesson
| +- Lesson 4: Description of lesson
|
+- Module 2 - Description of module
| |
| +- Lesson 1: Description of lesson
| +- Lesson 2: Description of lesson
|
+- Module 3 - Description of module
| |
| +- Lesson 1: Description of lesson
| +- Lesson 2: Description of lesson
| +- Lesson 3: Description of lesson
|
+- Module 4 - Description of module
|
+- Lesson 1: Description of lesson
+- Lesson 2: Description of lesson
UNIT 2 - Description of unit
|
+- Module 1 - Description of module
| |
| +- Lesson 1: Description of lesson
| +- Lesson 2: Description of lesson
| +- Lesson 3: Description of lesson
|
+- Module 2 - Description of module
| |
| +- Lesson 1: Description of lesson
| +- Lesson 2: Description of lesson
|
+- Module 3 - Description of module
|
+- Lesson 1: Description of lesson
+- Lesson 2: Description of lesson
+- Lesson 3: Description of lesson
# And so on...I just have no idea how I should be displaying the data. Should I be using unordered lists? Any input appreciated.
Displaying hierarchical data with HTML. - El Forum - 04-03-2009
[eluser]daveWid[/eluser]
Unordered lists would probably be the best way to do that. Making one for each unit would probably be the easiest to follow but sticking them all into 1 big list would work as well.
Code:
<ul>
<li>UNIT 1 - Description of unit
<ul>
<li>Module 1 - Description of module
<ul>
<li>Lesson 1: Description of lesson</li>
<li>Lesson 2: Description of lesson</li>
<li>Lesson 3: Description of lesson</li>
<li>Lesson 4: Description of lesson</li>
</ul>
</li>
</ul>
<ul>
<li>Module 2 - Description of module
<ul>
<li>Lesson 1: Description of lesson</li>
<li>Lesson 2: Description of lesson</li>
</ul>
</li>
</ul>
<ul>
<li>Module 3 - Description of module
<ul>
<li>Lesson 1: Description of lesson</li>
<li>Lesson 2: Description of lesson</li>
<li>Lesson 3: Description of lesson</li>
</ul>
</li>
</ul>
<ul>
<li>Module 4 - Description of module
<ul>
<li>Lesson 1: Description of lesson</li>
<li>Lesson 2: Description of lesson</li>
</ul>
</li>
</ul>
</li>
</ul>
# and so on...Displaying hierarchical data with HTML. - El Forum - 04-03-2009
[eluser]TheFuzzy0ne[/eluser]
That's what I was thinking. Many thanks.