Bygga huvud- och detaljsidor i Dreamweaver

Senast uppdaterad den 25 apr. 2024

Lär dig hur du bygger en mastersida i Dreamweaver och skapar länkar till en detaljsida.

Obs!

Användargränssnittet i Dreamweaver och senare har förenklats. Det kan därför hända att du inte hittar vissa av alternativen i den här artikeln i Dreamweaver och senare. Mer information finns i den här artikeln.

Om huvud- och detaljsidor

Master- och detaljsidor är uppsättningar av sidor som används för att organisera och visa data från postuppsättningar.Dessa sidor ger en besökare på din webbplats både en översikt och en detaljerad vy.Mastersidan listar alla poster och innehåller länkar till detaljsidor som visar ytterligare information om varje post.

Huvudsida

Detaljsida

Du kan bygga master- och detaljsidor genom att infoga ett dataobjekt för att skapa en mastersida och detaljsida i en operation eller genom att använda serverbeteenden för att bygga master- och detaljsidorna på ett mer anpassat sätt.När du använder serverbeteenden för att bygga master- och detaljsidor skapar du först en mastersida för att lista posterna och lägger sedan till länkar från listan till detaljsidorna.

Bygga en huvudsida

Innan du börjar ska du se till att du definierar en databasanslutning för din webbplats.

För att skapa en tom sida väljer du Arkiv > Ny > Tom sida, väljer en sidtyp och klickar på Skapa. Det här blir din huvudsida.
Definiera en postmängd.

I panelen Bindningar (Fönster > Bindningar) klickar du på Plus-knappen (+), väljer Postuppsättning och väljer alternativ. Om du vill skriva dina egna SQL-satser, klickar du på Avancerat.

Se till att postuppsättningen innehåller alla tabellkolumner du behöver för att skapa din mastersida.Postuppsättningen måste också innehålla tabellkolumnen som innehåller den unika nyckeln för varje post – det vill säga post-ID- kolumnen.I följande exempel innehåller kolumnen Kod den unika nyckeln för varje post.

Postmängdskolumner markerade för en huvudsida

Vanligtvis hämtar postuppsättningen på mastersidan några kolumner från en databastabell medan postuppsättningen på detaljsidan hämtar fler kolumner från samma tabell för att ge mer detaljerad information.

Postuppsättningen kan definieras av användaren vid körning.Mer information finns i Bygga sök- och resultatsidor.

Infoga en dynamisk tabell att visa posterna i.

Placera insättningspunkten där du vill att den dynamiska tabellen ska visas på sidan.Välj Infoga > Dataobjekt > Dynamiska data > Dynamisk tabell, ange alternativ och klicka på OK.

Om du inte vill visa post-ID:n för användare kan du ta bort kolumnen från den dynamiska tabellen.Klicka någonstans på sidan för att flytta fokus till sidan.Flytta markören nära toppen av kolumnen i den dynamiska tabellen tills kolumncellerna är markerade med rött och klicka sedan för att välja kolumnen.Tryck på Delete för att ta bort kolumnen från tabellen.

Efter att ha byggt mastersidan och lagt till posupsättningen skapar du länkar som öppnar detaljsidan.Du ändrar sedan länkarna för att skicka ID:na för de poster som användaren väljer. Detaljsidan använder detta ID för att hitta den begärda posten i databasen och visa den.

Obs!

Du skapar länkar för att uppdatera sidor med samma process. Resultatsidan liknar en mallsida, och uppdateringssidan liknar en detaljsida.

Öppna detaljsidan och skicka ett post-ID (ColdFusion, PHP)

I den dynamiska tabellen väljer du Innehåll- platshållaren för text som ska fungera som en länk.
Länkar som tillämpats på platshållaren markerade.

I egenskapsinspektören klickar du på mappikonen bredvid Länk-rutan.
Bläddra och markera detaljsidan. Detaljsidan visas i Länk-rutan i egenskapsinspektören.

I den dynamiska tabellen visas den markerade texten länkad. När sidan körs på server, tillämpas länken på texten i varje tabellrad.

Markera länken i den dynamiska tabellen på huvudsidan.
(ColdFusion) I Länk-rutan i egenskapsinspektören lägger du till följande sträng i slutet av URL:en:

?recordID=#recordsetName.fieldName#

Frågetecknet talar om för server att det som följer är en eller flera URL-parametrar. Ordet recordID är namnet på URL-parametern (du kan skapa vilket namn du vill). Anteckna namnet på URL-parametern eftersom du kommer att använda den på detaljsidan senare.

Uttrycket efter likhetstecknet är parameterns värde.I detta fall genereras värdet av ett ColdFusion-uttryck som returnerar ett post-ID från postuppsättningen. Ett annat ID genereras för varje rad i den dynamiska tabellen. I ColdFusion-uttrycket ersätter du recordsetName med namnet på din postuppsättning, och ersätter fieldName med namnet på fältet i din postuppsättning som unikt identifierar varje post.I de flesta fall består fältet av ett post-ID- nummer. I följande exempel består fältet av unika platskoder.

locationDetail.cfm?recordID=#rsLocations.CODE#

När sidan körs infogas värdena från postuppsättningens CODE-fält i motsvarande rader i den dynamiska tabellen.Om till exempel uthyrningsplatsen Canberra, Australien har koden CBR, används följande URL i Canberra-raden i den dynamiska tabellen:

locationDetail.cfm?recordID=CBR

(PHP) I Länk-fältet i egenskapsinspektören lägger du till följande sträng i slutet av URL:en:

?recordID=<?php echo $row_recordsetName['fieldName']; ?>

Frågetecknet talar om för servern att det som följer är en eller flera URL-parametrar.Ordet recordID är namnet på URL-parametern (du kan använda vilket namn du vill). Anteckna namnet på URL-parametern eftersom du kommer att använda det på detaljsidan senare.

Uttrycket efter likhetstecknet är värdet för parametern. I det här fallet genereras värdet av ett PHP-uttryck som returnerar ett post-ID från postuppsättningen. Ett annat ID genereras för varje rad i den dynamiska tabellen. I PHP-uttrycket ersätter du recordsetName med namnet på din postuppsättning och ersätter fieldName med namnet på fältet i din postuppsättning som unikt identifierar varje post. I de flesta fall består fältet av ett post-ID-nummer.I följande exempel består fältet av unika platskoder.

locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>

När sidan körs infogas värdena från postuppsättningens CODE-fält i motvarande rader i den dynamiska tabellen. Om till exempel hyrlokalen Canberra, Australien har koden CBR används följande URL i Canberra-raden i den dynamiska tabellen:

locationDetail.php?recordID=CBR

Spara sidan.

Öppna detaljsidan och skicka ett post-ID (ASP)

Välj det dynamiska innehållet som ska fungera som en länk.
I panelen Server Behaviors (Window > Server Behaviors) klickar du på plusknappen (+) och väljer Go to Detail Page från popup-menyn.
Klicka på Bläddra i rutan Detaljsida och sök reda på sidan.
Ange värdet du vill skicka till detaljsidan genom att välja en postuppsättning och en kolumn från popup-menyerna Recordset och Column.Normalt är värdet unikt för posten, till exempel postens unika nyckel-ID.
Om du vill kan du skicka befintliga sidparametrar till detaljsidan genom att välja alternativen URL Parameters eller Form Parameters.
Klicka på OK.

En speciell länk omgärdar den markerade texten. När användaren klickar på länken skickar serverbeteendet Go To Detail Page en URL-parameter som innehåller post-ID:t till detaljsidan. Om till exempel URL-parametern kallas id och detaljsidan kallas customerdetail.asp ser URL:en ut ungefär så här när användaren klickar på länken:

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

Den första delen av URL:en, http://www.mysite.com/customerdetail.asp, öppnar detaljsidan. Den andra delen, ?id=43, är URL-parametern. Den instruerar detaljsidan om vilken post som ska hämtas och visas. Termen id är namnet på URL-parametern och 43 är dess värde.I det här exemplet innehåller URL-parametern postens ID-nummer, 43.

Hitta och visa den begärda posten på detaljsidan

För att visa den post som begärs av mastersidan måste du definiera en postmängd som innehåller en enda post och binda postmängdens kolumner till detaljsidan.

Växla till detaljsidan. Om du inte har en detaljsida ännu, skapa en tom sida (Arkiv > Ny).
I panelen Bindings (Fönster > Bindings) klickar du på plusknappen (+) och väljer Recordset (fråga) eller DataSet (fråga) från popup-menyn.

Den enkla versionen av dialogrutan Postmängd eller Datauppsättning visas. Om den avancerade dialogrutan visas i stället, klicka på Enkel.

Namnge postmängden och välj en datakälla och databastabell som ska tillhandahålla data till din postmängd.
I området Kolumner, välja tabellkolumnerna att inkludera i recordset.

Recordsetet kan vara identiskt med eller skilt från recordsetet på huvudsidan.Vanligtvis har ett recordset för en detaljsida fler kolumner för att visa mer information.

Om recordseten är olika, se till att recordsetet på detaljsidan innehåller minst en kolumn som är gemensam med recordsetet på huvudsidan.Den gemensamma kolumnen är vanligtvis post-ID-kolumnen, men det kan också vara kopplingsfältet för relaterade tabeller.

För att inkludera endast några av tabellens kolumner i recordset, klicka på Markerad och välja önskade kolumner genom att Ctrl-klicka (Windows) eller Kommando-klicka (Macintosh) dem i listan.

Slutför filter-avsnittet för att hitta och visa posten som specificeras i URL-parametern som skickas av huvudsidan:
  • I den första popup-menyn i filterområdet väljer du kolumnen i recordset som innehåller värden som matchar värdet för URL-parametern som skickas av huvudsidan.Till exempel, om URL-parametern innehåller ett post-ID-nummer, väljer du kolumnen som innehåller post-ID-nummer.I exemplet som diskuterades i föregående avsnitt innehåller recordset-kolumnen kallad CODE värdena som matchar värdet för URL-parametern som skickas av huvudsidan.

  • Från popup-menyn bredvid den första menyn väljer du likhetstecknet (det borde redan vara valt).

  • På den tredje snabbmenyn markerar du URL-parameter. Huvudsidan använder en URL-parameter för att skicka information till detaljsidan.

  • I den fjärde rutan anger du namnet på URL-parametern som skickas av huvudsidan.

Klicka på OK. Postmängden visas i panelen Bindningar.
Bind recordset-kolumnerna till detaljsidan genom att välja kolumnerna i Bindings-panelen (Fönster > Bindings) och dra dem till sidan.

Efter att ha laddat upp både huvud- och detaljsidorna till servern kan du öppna huvudsidan i en webbläsare.Efter att ha klickat på en detaljlänk på huvudsidan öppnas detaljsidan med mer information om den valda posten.

Hitta en specifik post och visa den på en sida (ASP)

Du kan lägga till ett serverbeteende som hittar en specifik post i ett recordset så att du kan visa postdata på sidan.Server-beteendet är endast tillgängligt när du använder ASP-servermodellen.

Skapa en sida som uppfyller följande krav:
Lägg till serverbeteendet som hittar posten som specificeras av URL-parametern genom att klicka på Plus (+)-knappen i panelen Server Behaviors (Fönster > Server Behaviors) och välja Recordset Paging > Move to Specific Record.
I popup-menyn Move To Record In väljer du den recordset du definierade för sidan.
I popup-menyn Where Column väljer du den kolumn som innehåller värdet som skickas av den andra sidan.

Om den andra sidan till exempel skickar ett post-ID-nummer, välj kolumnen som innehåller post-ID-nummer.

I rutan Matches URL Parameter anger du namnet på URL-parametern som skickas av den andra sidan.

Om till exempel URL:en som den andra sidan använde för att öppna detaljsidan är id=43, ange id i rutan Matches URL Parameter.

Klicka på OK.

Nästa gång sidan begärs av en webbläsare läser serverbeteendet post-ID:t i URL-parametern som skickas av den andra sidan och flyttar till den specificerade posten i postuppsättningen.

Skapa master- och detaljsidor i ett steg

När du utvecklar webbapplikationer kan du snabbt bygga master- och detaljsidor med hjälp av dataobjektet Master Detail Page Set.

För att skapa en tom dynamisk sida väljer du Arkiv > Ny > Tom sida, välj en dynamisk sida från listan Sidtyp och klicka på Skapa.

Det här blir din huvudsida.

Definiera en postmängd för sidan.

Se till att recordseten innehåller inte bara alla kolumner du behöver för mastersidan, utan också alla kolumner du behöver för detaljsidan. Vanligtvis extraherar recordseten på mastersidan några kolumner från en databastabell medan recordseten på detaljsidan extraherar fler kolumner från samma tabell för att ge den extra detaljen.

Öppna mastersidan i designvy och välj Infoga > Dataobjekt > Master Detail Page Set.
I popup-menyn Recordset ser du till att recordsetet som innehåller posterna du vill visa på mastersidan är valt.
I området Master Page Fields väljer du de recordsetkolumner som ska visas på mastersidan.

Som standard är alla kolumner i postmängden markerade. Om din recordset innehåller en unik nyckelkolumn som recordID, välj den och klicka på minusknappen (-) så att den inte visas på din sida.

För att ändra ordningen som kolumnerna visas i på mastersidan väljer du en kolumn i listan och klickar på uppåt- eller nedåtpilen.

På mastersidan kommer recordsetkolumnerna att arrangeras horisontellt i en tabell. Klicka på uppåtpilen för att flytta kolumnen till vänster; klicka på nedåtpilen för att flytta kolumnen till höger.

I popup-menyn Link To Detail From väljer du kolumnen i recordseten som kommer att visa ett Värde som också fungerar som en länk till detaljsidan.

Om du till exempel vill att varje produktnamn på din mastersida ska ha en länk till detaljsidan, väljer du den postuppsättningskolumn som innehåller produktnamnen.

I popup-menyn Pass Unique Key väljer du kolumnen i postuppsättningen som innehåller värden som identifierar posterna.

Oftast används kolumnen med posternas ID-nummer. Detta värde skickas till detaljsidan så att den kan identifiera posten som användaren valt.

Avmarkera alternativet Numerisk om den unika nyckelkolumnen inte är numerisk.
Obs!

Det här alternativet är markerat som standard; det visas inte för alla servermodeller.

Ange antalet poster som ska visas på huvudsidan.
I rutan Detail Page Name klickar du på Bläddra och hittar detaljsidfilen du skapat, eller anger ett namn och låter dataobjektet skapa en åt dig.
I området Detail Page Fields väljer du de kolumner som ska visas på detaljsidan.

Som standard är alla kolumner i huvudsidans postuppsättning valda. Om postuppsättningen innehåller en unik nyckelkolumn som recordID, välja den och klicka på Minus (-)-knappen så att den inte visas på detaljsidan.

För att ändra ordningen i vilken kolumnerna visas på detaljsidan väljer du en kolumn i listan och klickar på uppåtpilen eller nedåtpilen.

På detaljsidan arrangeras postuppsättningskolumnerna vertikalt i en tabell. Att klicka på uppåtpilen flyttar kolumnen uppåt; att klicka på nedåtpilen flyttar kolumnen nedåt.

Klicka på OK.

Dataobjektet skapar en detaljsida (om du inte redan skapat en) och lägger till dynamiskt innehåll och serverbeteenden på både huvud- och detaljsidorna.

Anpassa layouten på huvud- och detaljsidorna enligt dina behov.

Du kan helt anpassa layouten på varje sida genom att använda Dreamweavers siddesignverktyg. Du kan också redigera serverbeteendena genom att dubbelklicka på dem i Server Behaviors-panel.

Efter att ha skapat huvud- och detaljsidor med dataobjektet använder du panelen Server Behaviors (Fönster > Server Behaviors) för att ändra de olika byggblocken som dataobjektet infogar på sidorna.