Skrevet af Tobias Hinnerup den 15. september 2006. Sidst redigeret den 10. maj 2002. © Alle rettigheder forbeholdt.

• ↑ Artikel om 'Faneblade i ASP'

Her diskuteres en objekt-orienteret realisering af det faneblads-system der er beskrevet i "Artikel om 'Faneblade i XHTML'". Derefter gives et kort eksempel på praktisk anvendelse.

Denne artikel er ikke ment som et kursus i ASP: Det er en praktisk løsning på en reel opgave. Er der emner i forbindelse med programmeringen der ikke er umiddelbart forståelige kan det anbefales at spørge i fora på www.asp.dk. Artiklen om faneblade i XHTML forudsættes læst.

Kildekode og eksempler kan findes på websitet for "Faneblade i XHTML".

Hvad er faneblade ?

Som den fremgår af artiklen om faneblade i XHTML, er det fornuftigt at opfatte disse som bestående af tre dele: Overskrifter og indholdssider, der er samlet i et panel. Et af de centrale punkter i objekt-orientering er netop at bibeholde de begreber og sammenhænge der er i problemområdet - så helt logisk må disse to begreber indgå centralt i implementationen.

De operationer der skal foretages på objekterne overskrift og indholdsside er relativt få: Der skal kunne tilføjes nye, og i forbindelse med visning af det omgivende panel skal alle de indeholde overskrifter og indholdssider også vises.

For at muliggøre flere faneblade på hver side, skal disse entydigt identificeres. Af "fysiske" karakteristika har faneblade en størrelse, og et fanblad der er valgt som standard.

Repræsentation i Visual Basic Script

Sammenfattende ovenstående, kan klasse-specifikationen for paneler opstilles som følger.

'OBS: VBS understøtter ikke klasse-definitioner (kun erklæringer).
'Dette er pseudo-kode for at illustrere det implementerede.
Class Panels
'Attributter
Private Labels() 'Array
Private PanelPages() 'Array
Public ID
Public Width
Public Height
Public DefaultPanel
Public Direction

'Funktioner
Private Function ShowPanelPages() 'Kaldes fra Show()
Private Function ShowLabel() 'Kaldes fra ShowLabels()
Private Function ShowLabels() 'Kaldes fra Show()
Public Function Show()
Public Sub Add(Label, PanelPage)
End Class

Ansvarsfordelingen mellem funktionerne er valgt helt analogt til den opdeling der er beskrevet i XHTML'en for fanebladssystemet: Show() håndterer den indlejrende tabel, og kalder ShowPanel() til at vise tabellen med indholdssiderne.

ShowLabels() viser tabellen der omslutter overskrifterne - og fordi overskrifterne kan arrangeres både horisontalt og vertikalt er det hensigtsmæssigt at lade udskriften af de enkelte overskrifter håndteres af ShowLabel(), idet placeringen af mellemrums-cellerne er forskellig afhængig af denne faktor.

Ved at lade udskrifts-funktionerne returnere udskriften snarere end at lade dem udskrive direkte på skærmen, opnås bedre kombinations-muligheder med andre komponenter. Det kunne også forestilles, at det i visse situationer var hensigtmæssigt at generere en færdig side, før der skrives til klienten (af perfomance-årsager).

Proceduren Add() har ingen retur-værdi. I tråd med udskrifts-funktionerne tager den to vilkårlige tekst-strenge som argument, og indsætter disse på deres retmæssige plads i de to dynamisk arrays.

Attributten DefaultPanel angiver hvilket faneblad der som standard skal være aktiveret. Direction kan tildeles een af fire mulige værdier: Top, Left eller Right, og er afgørende for overskrifternes placering i forhold til indholdssiderne.

Put the pedal to the metal...

For at anvende faneblads-systemet er det ikke tilstrækkeligt at have denne VBS-repræsentation til rådighed: De tilhørende JavaScript- og CSS-filer er også nødvendige. Givet disse tre filer, kan det nu lynhurtigt lade sig gøre at præsentere en XHTML side med faneblade. 

<!--#include virtual="/asp/panels.asp" -->
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da" lang="da">
  <head>
    <title>Faneblade i ASP</title>
    <link rel="stylesheet" type="text/css"
             href="css/panels.css" title="common"  />
    <script type="text/javascript" src="js/panels.js"></script>
  </head>
  <body>
    <%
    Dim DemoPanel
    Set DemoPanel = New Panels

    DemoPanel.Width = 175
    DemoPanel.Height = 100
    DemoPanel.DefaultPanel = 2

    DemoPanel.Add "Overskrift&nbsp;1", "Alternativt faneblad"
    DemoPanel.Add "Overskrift&nbsp;2", "Standard faneblad"

    DemoPanel.ID = "DemoLeft"
    DemoPanel.Direction = "Left"
    Response.Write DemoPanel.Show

    DemoPanel.ID = "DemoTop"
    DemoPanel.Direction = "Top"
    Response.Write DemoPanel.Show

    DemoPanel.ID = "DemoRight"
    DemoPanel.Direction = "Right"
    Response.Write DemoPanel.Show
    %><
  </body>
</html>
Overskrift 1
 
Overskrift 2
 
 
Alternativt faneblad Standard faneblad

Overskrift 1   Overskrift 2    
Alternativt faneblad Standard faneblad

Alternativt faneblad Standard faneblad
Overskrift 1
 
Overskrift 2
 
 

Resultatet af ovenstående kode-eksempel vil se ud som de tre faneblads-paneler her til højre (koden kopieret & indsat for at lave illustrationen).

Som det ses af kode-eksemplet, kræver det forbavsende få linier (de grønne er de relevante) at placere et sæt fungerende faneblade på en XHTML-side og det er endda ikke et minimalt eksempel der er vist.

Bemærk, at det er nødvendigt at angive en fornuftig værdi for ID (der ikke må være den samme for flere paneler), da JavaScript-funktionerne ellers ikke vil virke.

Højde og bredde kan udelades, idet de initialiseres når objektet instantieres. Det samme gælder standard-panelet, der normalt vil være det første. Det samme gælder attributten Direction der her er udeladt: Som standard antager den værdien Top.

Læg her også mærke til, at der i overskrifterne for de to faneblade er bruge &nbsp; i stedet for et almindeligt mellemrum. Dette skyldes den celle i slutningen af overskrifts-tabellen, der er tildelt en bredde på maks for at fyldes ud til kanten af indholdssiderne. Derfor vil overskriftes med almindelige mellemrum blive ombrudt, hvilket sjældent er ønskeligt.

Givet disse informationer, skulle det være en smal sag at anvende systemet i brug på egne sider, for eksempel i forbindelse med en gæstebog i en kode-stump der kunne ligne nedenstående. 

<%
    ' rsGuest antages at være et åbent RecordSet
    ' til en tabel med gæstebogs-indhold.

    Dim GuestPanel
    Set GuestPanel = New Panels
    GuestPanel.ID  = "Guest"

    Dim Guest
    Do Until rsGuest.EOF
    	Guest = Guest & "<p style="font-style: bold;">"
    	Guest = Guest & rsGuest("Name")
    	Guest = Guest "</p>"
    	Guest = Guest "<p>"
    	Guest = Guest & rsGuest("Comment")
    	Guest = Guest "<p>"

        GuestPanel.Add rsGuest("Dato"), GuestPage
        GuestPanel.Add "Overskrift&nbsp;2", "Standard faneblad"

       	rsGuest.MoveNext()
    Loop

    Response.Write DemoPanel.Show
%>
Idet det er begrænset hvor mange overskrifter der er plads til på en side, vil det i praksis blive nødvendigt at opdele en gæstebog i flere sider, muligvis ved at bruge paging på sit recordset.

Bemærk: Understøttelse af flere sider overskrifter vil muligvis blive implementeret i en fremtidig udgave af fanebladssystemet.

Den færdige implementation, demonstration og kilde-kode (både eXstensible HyperText Markup Language, Cascading StyleSheet og JavaScript) til det her beskrevne faneblads system kan findes på websitet for "Faneblade i XHTML".

Dér findes også en mængde baggrundsinformationer om systemet, som det er fuldstændig gratis at både hente og anvende. Undertegnede udbeder sig blot om at blive nævnt i sitets "Credits".

Tilføjelse af mulighed for at lægge overskrifterne under indholdssiderne er det overladt som en øvelse til læseren at implementere. Hint: Det skal ændres/tilføjes klasser i CSS-filen og modificeres i VBS-funktionen Show().

Valid XHTML 1.1!
Valid CSS!

God fornøjelse.

Tobias Hinnerup
10. maj 2002