Hoofd- en detailpagina's maken in Dreamweaver

Kies Bestand > Nieuw > Lege pagina, selecteer een paginaformaat en klik op Maken om een lege pagina te maken. Deze pagina wordt de hoofdpagina.

Definieer een recordset.

Klik in het paneel Bindingen (Windows > Bindingen) op de plusknop (+), selecteer Recordset en kies de gewenste opties. Klik op Geavanceerd als u uw eigen SQL-instructie wilt schrijven.

Zorg ervoor dat de recordset alle tabelkolommen bevat die u nodig hebt om de hoofdpagina te maken. De recordset moet ook de tabelkolom bevatten die de unieke sleutel van elke record bevat, dus de kolom met de record-id. In het volgende voorbeeld bevat de kolom Code de unieke sleutel van elke record.

Gewoonlijk haalt de recordset op de hoofdpagina enkele kolommen uit een database terwijl de recordset op de detailpagina meer kolommen uit dezelfde tabel ophaalt om de extra details te kunnen geven.

De recordset kan door de gebruiker in runtime worden gedefinieerd. Zie Zoekpagina's en resultatenpagina's samenstellen voor meer informatie.

Een dynamische tabel invoegen om de records weer te geven.

Plaats de invoegpositie waar u de dynamische tabel op de pagina wilt weergeven. Kies Invoegen > Gegevensobjecten > Dynamische gegevens > Dynamische tabel, stel de opties in en klik op OK.

Als u niet wilt dat gebruikers record-id's te zien krijgen, kunt u de kolom uit de dynamische tabel verwijderen. Klik ergens op de pagina om de pagina te selecteren. Verplaats de cursor naar de bovenkant van de kolom in de dynamische tabel tot de kolomcellen met rood worden omlijnd. Klik dan om de kolom te selecteren. Druk op Delete om de kolom uit de tabel te verwijderen.

Selecteer in de dynamische tabel de tijdelijke aanduiding voor tekst die als een koppeling zal dienen.

Klik in de eigenschappencontrole op het mappictogram naast het vak Koppeling.

Zoek en selecteer de detailpagina. De detailpagina wordt weergegeven in het vak Koppeling van de eigenschappencontrole.

In de dynamische tabel wordt de geselecteerde tekst weergegeven als gekoppeld. Wanneer de pagina op de server wordt uitgevoerd, wordt de koppeling toegepast op de tekst in elke tabelrij.

Selecteer op de hoofdpagina de koppeling in de dynamische tabel.

(ColdFusion) In het vak Koppeling van de eigenschappencontrole voegt u de volgende tekenreeks aan het einde van de URL toe:

Het vraagteken vertelt de server dat er na het vraagteken een of meer URL-parameters volgen. Het woord recordID is de naam van de URL-parameter (u mag ook een andere naam kiezen). Noteer de naam van de URL-parameter, want die gaat u later op de detailpagina gebruiken.

De expressie na het gelijkteken is de waarde van de parameter. In dit geval wordt de waarde gegenereerd door een ColdFusion-expressie die een record-id uit de recordset retourneert. Voor elke rij in de dynamische tabel wordt een andere id gegenereerd. Vervang recordsetName in de ColdFusion-expressie door de naam van de recordset, en vervang fieldName door de naam van het veld in uw recordset dat elke record op unieke wijze identificeert. In de meeste gevallen bestaat het veld uit een record-id-nummer. In het volgende voorbeeld bestaat het veld uit unieke locatiecodes.

Wanneer de pagina wordt uitgevoerd, worden de waarden van het veld CODE van de recordset ingevoegd in de corresponderende rijen van de dynamische tabel. Als de verhuurlocatie Canberra, Australië bijvoorbeeld de code CBR heeft, wordt de volgende URL gebruikt in de rij Canberra van de dynamische tabel:

(PHP) In het veld Koppeling van de eigenschappencontrole voegt u de volgende tekenreeks aan het einde van de URL toe:

Het vraagteken vertelt de server dat er na het vraagteken een of meer URL-parameters volgen. Het woord recordID is de naam van de URL-parameter (u mag ook een andere naam gebruiken). Noteer de naam van de URL-parameter, want die gaat u later op de detailpagina gebruiken.

De expressie na het gelijkteken is de waarde van de parameter. In dit geval wordt de waarde gegenereerd door een PHP-expressie die een record-id uit de recordset retourneert. Voor elke rij in de dynamische tabel wordt een andere id gegenereerd. Vervang recordsetName in de PHP-expressie door de naam van de recordset, en vervang fieldName door de naam van het veld in uw recordset dat elke record op unieke wijze identificeert. In de meeste gevallen bestaat het veld uit een record-id-nummer. In het volgende voorbeeld bestaat het veld uit unieke locatiecodes.

Wanneer de pagina wordt uitgevoerd, worden de waarden van het veld CODE van de recordset ingevoegd in de corresponderende rijen van de dynamische tabel. Als de verhuurlocatie Canberra, Australië bijvoorbeeld de code CBR heeft, wordt de volgende URL gebruikt in de rij Canberra van de dynamische tabel:

Sla de pagina op.

Selecteer de dynamische inhoud om als koppeling te kopiëren.

Klik in het deelvenster Servergedrag (Venster > Servergedrag) op de plusknop (+) en kies Naar detailpagina in het pop-upmenu.

Klik in het vak Detailpagina op Bladeren en zoek de pagina.

Geef de waarde op die u aan de detailpagina wilt doorgeven door een recordset en een kolom te selecteren in de menu's Recordset en Kolom. Gewoonlijk is de waarde uniek voor de record, zoals de unieke sleutel-id van de record.

Geef desgewenst bestaande paginaparameters aan de detailpagina door door de opties URL-parameters of Formulierparameters te selecteren.

Klik op OK.

De geselecteerde tekst wordt met een speciale koppeling omkaderd. Wanneer de gebruiker op de koppeling klikt, geeft het servergedrag 'Ga naar detailpagina' een URL-parameter met de record-id door aan de detailpagina. Als de URL-parameter bijvoorbeeld id is genoemd en de detailpagina customerdetail.asp is genoemd, ziet de URL er ongeveer als volgt uit wanneer de gebruiker op de koppeling klikt:

http://www.mysite.com/customerdetail.asp?id=43

Het eerste deel van de URL, http://www.mysite.com/customerdetail.asp, opent de detailpagina. Het tweede deel, ?id=43, is de URL-parameter. Deze vertelt de detailpagina welke record moet worden opgehaald en weergegeven. De term id is de naam van de URL-parameter en 43 is de waarde daarvan. In dit voorbeeld bevat de URL-parameter het id-nummer van de record, 43.

Schakel over naar de detailpagina. Als u nog geen detailpagina hebt, maakt u een lege pagina (Bestand > Nieuw).

Klik in het paneel Bindingen (Venster > Bindingen) op de plusknop (+) en kies Recordset (Query) of Gegevensset (Query) in het pop-upmenu.

Het dialoogvenster Eenvoudige recordset of gegevensset wordt geopend. Als het geavanceerde dialoogvenster wordt geopend, klikt u op Eenvoudig.

Geef de recordset een naam, en selecteer een gegevensbron en de databasetabel waaruit de recordset de gegevens moet ophalen.

Selecteer in het gebied Kolommen de tabelkolommen die u in de recordset wilt opnemen.

De recordset kan gelijk zijn aan de recordset op de hoofdpagina. Dat is echter niet noodzakelijk. Gewoonlijk heeft een recordset voor een detailpagina meerdere kolommen om meer details weer te geven.

Als de recordsets verschillend zijn, moet u ervoor zorgen dat de recordset op de detailpagina minstens één kolom gemeenschappelijk heeft met de recordset op de hoofdpagina. De gemeenschappelijke kolom is gewoonlijk de kolom met de record-id, maar het kan ook het join-veld van gerelateerde tabellen zijn.

Als u slechts enkele tabelkolommen in de recordset wilt opnemen, klikt u op Geselecteerd en kiest u de gewenste kolommen door op de kolommen in de lijst te klikken terwijl u Control (Windows) of Command (Macintosh) ingedrukt houdt.

Vul de sectie Filter in om de record te zoeken en weer te geven die is opgegeven in de URL-parameter die door de hoofdpagina is doorgegeven:

• Selecteer in het eerste pop-upmenu in het gebied Filter de kolom in de recordset met waarden die overeenkomen met de waarde van de URL-parameter die door de hoofdpagina is doorgegeven. Als de URL-parameter bijvoorbeeld een record-id-nummer bevat, selecteert u de kolom die record-id-nummers bevat. In het eerder besproken voorbeeld bevat de recordsetkolom CODE de waarden die overeenkomen met de waarde van de URL-parameter die door de hoofdpagina is doorgegeven.

• Selecteer in het pop-upmenu naast het eerste menu het gelijkteken (dit moet al zijn geselecteerd).

• Selecteer in het derde pop-upmenu de optie URL-parameter. De hoofdpagina gebruikt een URL-parameter om informatie door te geven aan de detailpagina.

• Voer in het vierde vak de naam in van de URL-parameter die de hoofdpagina heeft doorgegeven.

Klik op OK. De recordset wordt in het paneel Bindingen weergegeven.

Koppel de recordsetkolommen aan de detailpagina door de kolommen in het paneel Bindingen (Venster > Bindingen) te selecteren, en ze naar de pagina te slepen.

Wanneer u zowel de hoofdpagina als de detailpagina op de server hebt geladen, kunt u de hoofdpagina in een browser openen. Wanneer u op een detailkoppeling op de hoofdpagina klikt, wordt de detailpagina geopend met meer informatie over de geselecteerde record.

Maak een pagina die aan de volgende voorwaarden voldoet:

• Een record-id is opgenomen in een URL-parameter die door een andere pagina is doorgegeven aan de huidige pagina. De URL-parameters op de andere pagina kunt u maken met HTML-hyperlinks of met een HTML-formulier. Zie Formulieren gebruiken om informatie van gebruikers te verzamelen voor meer informatie.

• Er is een recordset gedefinieerd voor de huidige pagina. Het servergedrag haalt de recorddetails uit deze recordset op. Zie Een recordset definiëren zonder SQL te schrijven of Een geavanceerde recordset definiëren door SQL te schrijven voor instructies.

• Er zijn recordsetkolommen aan de pagina gekoppeld. De specifieke record moet op de pagina worden weergegeven. Zie Tekst dynamisch maken voor meer informatie.

U kunt het servergedrag voor het zoeken naar de record die is opgegeven in de URL-parameter, toevoegen door te klikken op de plusknop (+) in het paneel Servergedrag (Window > Servergedrag) en Recordset pagineren > Ga naar specifiek record.

Selecteer in het pop-upmenu 'Ga naar record in' de recordset die u voor de pagina hebt gedefinieerd.

Selecteer in het pop-upmenu Waarbij-kolom de kolom die de waarde bevat die door de andere pagina is doorgegeven.

Als de andere pagina bijvoorbeeld een record-id-nummer doorgeeft, selecteert u de kolom die record-id-nummers bevat.

Voer in het vak Komt overeen met URL-parameter de naam in van de URL-parameter die door de andere pagina is doorgegeven.

Als de bijvoorbeeld de URL die de andere pagina heeft gebruikt om de detailpagina te openen, id=43 is, voert u in het vak Komt overeen met URL-parameter de tekst id in.

Klik op OK.

Wanneer de pagina een volgende keer door een browser wordt opgevraagd, leest het servergedrag de record-id in de URL-parameter die door de andere pagina is doorgegeven, en wordt de opgegeven record in de recordset opgehaald.

Kies Bestand > Nieuw > Lege pagina, selecteer in de lijst Paginatype een dynamische pagina en klik op Maken om een lege dynamische pagina te maken.

Deze pagina wordt de hoofdpagina.

Definieer een recordset voor de pagina.

Zorg ervoor dat de recordset niet alleen alle kolommen bevat die u voor de hoofdpagina nodig hebt, maar ook alle kolommen die u voor de detailpagina nodig hebt. Gewoonlijk haalt de recordset op de hoofdpagina enkele kolommen uit een database terwijl de recordset op de detailpagina meer kolommen uit dezelfde tabel ophaalt om de extra details te kunnen geven.

Open de hoofdpagina in de ontwerpweergave en selecteer Invoegen > Gegevensobjecten > Hoofddetailpaginaset.

Controleer in het pop-upmenu Recordset of de recordset is geselecteerd die de records bevat die u op de hoofdpagina wilt weergeven.

Selecteer in het gebied Hoofdpaginavelden de recordsetkolommen die u op de hoofdpagina wilt weergeven.

Standaard zijn alle kolommen in de recordset geselecteerd. Als uw recordset een kolom met een unieke sleutel bevat, zoals recordID, selecteert u deze kolom en klikt u op de minknop (-), zodat deze kolom niet op de pagina wordt weergegeven.

Als u de volgorde wilt veranderen waarin de kolommen op de hoofdpagina worden weergegeven, selecteert u een kolom in de lijst en klikt u op de pijl-omhoog of -omlaag.

Op de hoofdpagina worden de recordsetkolommen horizontaal in een tabel weergegeven. Klik op de pijl-omhoog om de kolom naar links te verplaatsen en klik op de pijl-omlaag om de kolom naar rechts te verplaatsen.

Selecteer in het pop-upmenu 'Naar detailpagina gaan vanuit' de kolom in de recordset die een waarde weergeeft die ook als een koppeling naar de detailpagina fungeert.

Als u bijvoorbeeld wilt dat elke productnaam op de hoofdpagina een koppeling bevat naar de detailpagina, selecteert u de recordsetkolom die de productnamen bevat.

Selecteer in het pop-upmenu Unieke sleutel doorgeven de kolom in de recordset die de waarden bevat die de records identificeren.

Gewoonlijk wordt de kolom met het record-id-nummer gekozen. Deze waarde wordt aan de detailpagina doorgegeven zodat deze weet welke record door de gebruiker is gekozen.

Schakel de optie Numeriek uit als de kolom met de unieke sleutel niet numeriek is.

Geef op hoeveel records op de hoofdpagina moeten worden weergegeven.

Klik in het vak Naam van detailpagina op Bladeren en zoek het detailpaginabestand dat u hebt gemaakt, of voer een naam in en laat het gegevensobject een detailpagina voor u maken.

Selecteer in het gebied Detailpaginavelden de kolommen die u op de detailpagina wilt weergeven.

Standaard zijn alle kolommen in de recordset van de hoofdpagina geselecteerd. Als de recordset een kolom met een unieke sleutel bevat, zoals recordID, selecteert u deze kolom en klikt u op de minknop (-), zodat deze kolom niet op de detailpagina wordt weergegeven.

Als u de volgorde wilt veranderen waarin de kolommen op de detailpagina worden weergegeven, selecteert u een kolom in de lijst en klikt u op de pijl-omhoog of -omlaag.

Op de detailpagina worden de recordsetkolommen verticaal in een tabel geplaatst. Klik op de pijl-omhoog om de kolom naar boven te verplaatsen, en klik op de pijl-omlaag om de kolom naar beneden te verplaatsen.

Klik op OK.

Het gegevensobject maakt een detailpagina (als u er nog geen had gemaakt) en voegt dynamische inhoud en servergedrag aan zowel de hoofd- als de detailpagina toe.

Pas de indeling van de hoofd- en detailpagina's aan uw behoeften aan.

U kunt de indeling van elke pagina geheel aanpassen met behulp van de pagina-ontwerpgereedschappen van Dreamweaver. U kunt ook het servergedrag bewerken door er in het paneel Servergedrag op te dubbelklikken.

Wanneer u de hoofd- en detailpagina's met het gegevensobject hebt gemaakt, gebruikt u het paneel Servergedrag (Venster > Servergedrag) om de diverse elementen te wijzigen die het gegevensobject op de pagina's invoegt.