Bygg en postinmatningssida

Senast uppdaterad den 25 apr. 2024

Lär dig hur du skapar en postinmatningssida i ditt Dreamweaver-program så att användarna kan mata in nya poster i en databas.

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 att bygga postinmatningssidor

Ditt program kan innehålla en sida som gör det möjligt för användare att infoga nya poster i en databas.

En inmatningssida består av två byggblock:

  • Ett HTML-formulär där användarna kan mata in data

  • Serverfunktionen Infoga post som uppdaterar databasen

    När en användare klickar på Skicka i ett formulär, infogar serverfunktionen poster i en databastabell.

    Du kan lägga till dessa byggstenar i en enda operation med dataobjektet Record Insertion Form eller så kan du lägga till dem separat med Dreamweaver-formulärverktygen och panelen Server Behaviors.

Obs!

Inmatningssidan kan bara innehålla en postredigerande serverfunktion åt gången. Du kan till exempel inte lägga till serverfunktionerna Uppdatera post eller Ta bort post på inmatningssidan.

Bygga en inmatningssida block för block

Du kan också bygga en infogningssida med hjälp av formulärverktygen och serverbeteenden.

Lägga till ett HTML-formulär på en inmatningssida

Skapa en dynamisk sida (File > New > Blank Page) och utforma din sida med hjälp av Dreamweavers designverktyg.
Lägg till ett HTML-formulär genom att placera insättningsmärket där du vill att formuläret ska visas och välja Insert > Form > Form.

Ett tomt formulär skapas på sidan. Du kanske behöver aktivera Invisible Elements (View > Visual Aids > Invisible Elements) för att se formulärets gränser, som representeras av tunna röda linjer.

Namnge HTML-formuläret genom att klicka på <form>-taggen längst ned i dokumentfönstret för att välja formuläret, öppna Property inspector (Window > Properties) och ange ett namn i rutan Form Name.

Du behöver inte specificera ett action- eller method-attribut för formuläret för att tala om för det var och hur postdata ska skickas när användaren klickar på Submit-knappen. Server behavior Insert Record ställer in dessa attribut åt dig.

Lägg till ett formulärobjekt som ett textfält (Insert > Form > Text Field) för varje kolumn i databastabellen som du vill infoga poster i.

Formulärobjekten används för datainmatning. Textfält är vanliga för detta ändamål, men du kan också använda menyer, alternativ och radioknappar.

Lägg till en Submit-knapp till formuläret (Insert > Form > Button).

Du kan ändra etiketten för Skicka-knappen genom att välja knappen, öppna egenskapsinspektören (Fönster > Egenskaper) och ange ett nytt värde i rutan Etikett.

Lägg till en server behavior för att infoga poster i en databastabell (ColdFusion)

I panelen Server Behaviors (Window > Server Behaviors) klickar du på Plus (+)-knappen och väljer Insert Record från popup-menyn.
Välj ett formulär på snabbmenyn Skicka värden från.
I popup-menyn Data Source väljer du en anslutning till databasen.
Ange ditt användarnamn och lösenord.
I popup-menyn Insert Into Table väljer du databastabellen som posten ska infogas i.
Specificera en databaskolumn för att infoga posten i, välj formulärobjektet som ska infoga posten från popup-menyn Value och välj sedan en datatyp för formulärobjektet från popup-menyn Submit As.

Datatypen är den typ av data som kolumnen i din databastabell förväntar sig (text, numerisk, booleska alternativvärden).

Upprepa proceduren för varje formulärobjekt i ditt formulär.

I rutan After Inserting, Go To anger du sidan som ska öppnas efter att posten infogats i tabellen eller klickar på knappen Browse för att bläddra till filen.
Klicka på OK.

Dreamweaver lägger till ett serverbeteende på sidan som låter användare infoga poster i en databastabell genom att fylla i HTML-formuläret och klicka på Skicka-knappen.

Lägg till en server behavior för att infoga poster i en databastabell (ASP)

I panelen Server Behaviors (Window > Server Behaviors) klickar du på Plus (+)-knappen och väljer Insert Record från popup-menyn.
I popup-menyn Connection väljer du en anslutning till databasen.

Klicka på Definiera om du behöver definiera en anslutning.

I popup-menyn Infoga i tabell väljer du databastabellen som posten ska infogas i.
I rutan Efter infogning, gå till anger du sidan som ska öppnas efter att posten har infogats i tabellen eller klickar på Bläddra för att bläddra till filen.
I popup-menyn Hämta värden från väljer du HTML-formuläret som används för att ange data.

Dreamweaver väljer automatiskt det första formuläret på din sida.

Ange en databaskolumn att infoga posten i, välj formulärobjektet som ska infoga posten från popup-menyn Värde och välj sedan en datatyp för formulärobjektet från popup-menyn Skicka som.

Datatypen är den typ av data som kolumnen i din databastabell förväntar sig (text, numerisk, booleska alternativvärden).

Upprepa proceduren för varje formulärobjekt i ditt formulär.

Klicka på OK.

Dreamweaver lägger till ett serverbeteende på sidan som låter användare infoga poster i en databastabell genom att fylla i HTML-formuläret och klicka på Skicka-knappen.

För att redigera serverbeteendet öppnar du panelen Serverbeteenden (Fönster > Serverbeteenden) och dubbelklickar på beteendet Infoga post.

Lägg till ett server-beteende för att infoga poster i en databastabell (PHP)

I panelen Serverbeteenden (Fönster > Serverbeteenden) klickar du på Plus-knappen (+) och väljer Infoga post från popup-menyn.
Välj ett formulär på snabbmenyn Skicka värden från.
Välj en anslutning till databasen i popup-menyn Anslutning.
I popup-menyn Infoga tabell väljer du den databastabell där posten ska infogas.
Ange en databaskolumn att infoga posten i, välj formulärobjektet som ska infoga posten från popup-menyn Värde och välj sedan en datatyp för formulärobjektet från popup-menyn Skicka som.

Datatypen är den typ av data som kolumnen i din databastabell förväntar sig (text, numerisk, booleska alternativvärden).

Upprepa proceduren för varje formulärobjekt i ditt formulär.

I rutan Efter infogning, gå till anger du sidan som ska öppnas efter att posten har infogats i tabellen eller klickar på knappen Bläddra för att bläddra till filen.
Klicka på OK.

Dreamweaver lägger till ett serverbeteende på sidan som låter användare infoga poster i en databastabell genom att fylla i HTML-formuläret och klicka på Skicka-knappen.

Bygga inmatningssidan i en enda åtgärd

Öppna sidan i designvyn och välj Infoga > Dataobjekt > Infoga post > Guiden för postinfogningsformulär.
I popup-menyn Anslutning väljer du en anslutning till databasen.Klicka på Definiera om du behöver definiera en anslutning.
I popup-menyn Infoga i tabell väljer du databastabellen som posten ska infogas i.
Om du använder ColdFusion, anger du ett användarnamn och ett lösenord.
I rutan Efter infogning, gå till anger du sidan som ska öppnas efter att posten har infogats i tabellen eller klickar på knappen Bläddra för att bläddra till filen.
I området Formulärfält anger du formulärobjekten du vill inkludera i infogningssidans HTML-formulär och vilka kolumner i din databastabell som varje formulärobjekt ska uppdatera.

Som standard skapar Dreamweaver ett formulärobjekt för varje kolumn i databastabellen.Om din databas automatiskt genererar unika nyckel-ID:n för varje ny post som skapas tar du bort formulärobjektet som motsvarar nyckelkolumnen genom att välja det i listan och klicka på Minus-knappen (-).Detta eliminerar risken att användaren av formuläret anger ett ID-värde som redan finns.

Du kan även ändra ordningen på formulärobjekten på HTML-formuläret genom att välja ett formulärobjekt i listan och klicka på nedåt- eller uppåtpilen på höger sida av dialogrutan.

Ange hur varje datainmatningsfält ska visas på HTML-formuläret genom att klicka på en rad i tabellen Formulärfält och ange följande information i rutorna under tabellen:
  • I rutan Etikett anger du en beskrivande etikett som ska visas bredvid datainmatningsfältet. Som standard visar Dreamweaver tabellkolumnens namn i etiketten.

  • Markera ett formulärobjekt som ska fungera som datainmatningsfält i snabbmenyn Visa som. Du kan välja Textfält, Textområde, Meny, Kryssruta, Alternativknappar och Text. Välj Text för skrivskyddade inmatningar. Du kan även välja Lösenordsfält, Filfält och Dolt fält.

Obs!

Dolda fält infogas i slutet av formuläret.

  • I snabbmenyn Skicka som markerar du det dataformat som stöds av databastabellkolumnen. Om tabellkolumnen till exempel endast kan ta emot numeriska data, markerar du Numerisk.
  • Ange formulärobjektets egenskaper. Beroende på vilket formulärobjekt du markerar som datainmatningsfält, har du olika alternativ att ta ställning till. För textfält, textområden och text kan du ange ett ursprungligt värde. Egenskaperna för menyer och grupper med alternativknappar kan du ange genom att öppna en annan dialogruta. För alternativ markerar du alternativet Markerat eller Omarkerat.  
Klicka på OK.

Dreamweaver lägger till både ett HTML-formulär och ett serverbeteende för Infoga post på din sida. Formulärobjekten läggs ut i en grundläggande tabell som du kan anpassa med Dreamweavers siddesignverktyg.(Se till att alla formulärobjekt ligger kvar inom formulärets gränser.)

För att redigera serverbeteendet öppnar du panelen Serverbeteenden (Fönster > Serverbeteenden) och dubbelklickar på beteendet Infoga post.

Liknande innehåll