Eenvoudige HTML code om detailblok tekst op te roepen??

[demichel]

Even situeren: ik ben Oracle DBA/IT-verantwoordelijke/manusje van alles, enige IT-er in onderneming van 800 man.

Nu wil ik voor het Management een webpagina voorzien waar ze per project een volledige analyse van kosten/baten kunnen oproepen. Al deze cijfers zijn nu reeds beschikbaar via de Oracle forms schermen, maar geven nooit écht een intuïtief overzicht. Ik wil in een basispagina tonen, bijvoorbeeld (zeer simpel voorgesteld):

Kosten = 1000
Opbrengsten = 1500

Waarna men kan verder klikken om details van deze bedragen te zien, eventueel per periode, tot op het laagste niveau, tot het bestellen van een stukje metaal of het sturen van een factuur van 5 Euro voor dat stukje metaal.

Nu ken ik wel basic HTML, en da's het enige wat ik nodig heb. Hoeft niet fancy te zijn. Ik gebruik courier font, gewoon simpel, plus wat tables om de bedragen te tonen.

Wat ik wel zou willen, is de mogelijkheid om, als op een bedrag geklikt wordt, er "tijdelijik" een blok tekst tussen te voegen.

Voorbeeld:

Kosten = 1000
Opbrengsten = 1500

Men klikt op "1000" --> het resultaat wordt:

Kosten = 1000
--> Grondstoffen = 400
--> Personeel = 500
--> Diversen = 100
Opbrengsten = 1500

Klikt men nogmaals op 1000 of "ergens in die nieuwe blok", dan verdwijnt die blok weer en krijgen we weer:

Kosten = 1000
Opbrengsten = 1500

Op die manier kan Management vlot, intuïtief, de cijfers bekijken en interpreteren en meer details opvragen als ze dat nodig vinden.

Wil ook iets complexer gaan, bijvoorbeeld:

Periode 1/2012 2/2012 3/2012 4/2012 5/2012 6/2012
Kosten 100 ..... 200 ..... 300..... 100 ..... 200..... 100


(tekst komt hier blijkbaar niet mooi in een tabel door daarom heb ik de ..... toegevoegd, maar jullie begrijpen wel wat ik bedoel)

Telkens er op een bedrag bij "Kosten" geklikt wordt, wordt een detailblok gegeven met details van de kosten binnen die bepaalde periode.

Klikt men bijvoorbeeld eerst het bedrag 100 aan en daarna ook 200 aan, dan krijgt men:

Periode 1/2012 2/2012 3/2012 4/2012 5/2012 6/2012
Kosten 100 ..... 200 ..... 300..... 100 ..... 200..... 100
1/2012:
Metaal 50
Personeel 15
Hout 30
Allerlei 5

2/2012:
Metaal 100
Personeel 50
Diversen 50


Hoe zou ik dat kunnen verwezenlijken? Ik kan me niet voorstellen dat dat zeer complex moet zijn, en ik verwacht ook niet dat jullie die code voor mij schrijven, maar als jullie een indicatie geven wélke HTML-commando's ik hiervoor kan googlen en bestuderen, ik zou jullie zeer dankbaar zijn !!!

[ Voor 23% gewijzigd door demichel op 15-08-2012 12:17 ]

[Raven]

Zoiets? http://www.sothink.com/pr...enu/samples/html/html.htm
Menu en tree zijn de zoektermen, met collapsible menu zou je ook wel wat moeten kunnen vinden.

[ Voor 29% gewijzigd door Raven op 15-08-2012 12:12 ]

[demichel]

Raven schreef op woensdag 15 augustus 2012 @ 12:06:
Zoiets? http://www.sothink.com/pr...enu/samples/html/html.htm
Menu en tree zijn de zoektermen, met collapsible menu zou je ook wel wat moeten kunnen vinden.

Dank, Raven, ik bekijk het even !!!

[q-enf0rcer.1]

Ik zou met JavaScript de CSS style van de elementen die te voorschijn moeten komen veranderen van "display: none" naar "display: block" wanneer er op bijvoorbeeld kosten wordt geklikt.

[ Voor 5% gewijzigd door q-enf0rcer.1 op 15-08-2012 12:15 ]

[demichel]

q-enf0rcer.1 schreef op woensdag 15 augustus 2012 @ 12:15:
Ik zou met JavaScript de CSS style van de elementen die te voorschijn moeten komen veranderen van "display: none" naar "display: block" wanneer er op bijvoorbeeld kosten wordt geklikt.

Aha, als ik het dan goed begrijp, kan ik ieder blokje info (vb. "kosten van periode 1/2012") een label geven (vb. KOSTEN-201201') en deze door het klikken op bepaalde links door JavaScript commando's laten verschijnen vb (ik zeg maar iets): when-clicked-on-1/2012 then set_attribute('KOSTEN-201201', "block"), zoiets? Lijkt me eenvoudig.

Hoeft niet complex/fancy te zijn, als het werkt is dat al voldoende en is Management tevree dat ze cijfers zien.

[phex]

http://jsfiddle.net/7ABZr/10/

Succes

[ Voor 18% gewijzigd door phex op 15-08-2012 14:08 ]

[MueR]

Dit is toch wel echt te basic voor de Devschuur. Een beetje eigen inzet mag wel. Zie Devschuur® Beleid