Ondersteuning voor HTML-formulierelementen is verbeterd in Dreamweaver Creative Cloud-updates. Zie Verbeterde HTML5-ondersteuning voor formulierelementen voor meer informatie.
Wanneer een bezoeker informatie invoert in een webformulier dat in een webbrowser wordt weergegeven, en op de verzendknop klikt, wordt de informatie verstuurd naar de server waar deze wordt verwerkt door een script of toepassing op de server. De server antwoordt door de verwerkte informatie weer naar de gebruiker (of client) terug te sturen of door een andere actie uit te voeren op basis van de inhoud van het formulier.
U kunt formulieren maken die gegevens verzenden naar de meeste toepassingsservers, waaronder PHP, ASP en ColdFusion. Als u ColdFusion gebruikt, kunt u ook specifieke ColdFusion-formulierbesturingselementen aan uw formulieren toevoegen.
U kunt de formuliergegevens ook rechtstreeks naar een e-mailontvanger versturen.
In Dreamweaver worden formulierinvoertypen formulierobjecten genoemd. Formulierobjecten zijn de mechanismen waarmee gebruikers gegevens invoeren. U kunt de volgende formulierobjecten aan een formulier toevoegen:
Tekstvelden
Accepteren elk type alfanumerieke tekstinvoer. De tekst kan worden weergegeven op een enkele regel, op meerdere regels of als een wachtwoordveld waarin ingevoerde tekst wordt vervangen door sterretjes of opsommingstekens om het wachtwoord voor anderen te verbergen.
Wachtwoorden en andere informatie die via een wachtwoordveld naar een server worden verzonden, worden niet versleuteld. De overgebrachte gegevens kunnen worden onderschept en als alfanumerieke tekst worden gelezen. Daarom moet u gegevens die u wilt beveiligen, altijd versleutelen.
Verborgen velden
Slaan informatie op die een gebruiker heeft ingevoerd, zoals naam, e-mailadres of weergavevoorkeur. Deze gegevens worden opnieuw gebruikt wanneer de gebruiker de site nogmaals bezoekt.
Knoppen
Voeren acties uit wanneer erop wordt geklikt. U kunt een aangepaste naam of label voor een knop toevoegen, of een van de vooraf gedefinieerde tags 'Verzenden' of 'Beginwaarden' gebruiken. Gebruik een knop om formuliergegevens naar de server te verzenden of de beginwaarden van het formulier te herstellen. U kunt ook andere verwerkingstaken toekennen die u in een script definieert. U kunt bijvoorbeeld een knop invoegen om de totale kosten van geselecteerde items te berekenen op basis van toegewezen waarden.
Selectievakjes
Hiermee maakt u meerdere antwoorden in een enkele groep opties mogelijk. Een gebruiker kan net zoveel opties selecteren als van toepassing kunnen zijn. In het volgende voorbeeld ziet u hoe drie selectievakjes zijn geselecteerd: Surfen, Mountainbiken en Raften.
Keuzerondjes
Hiermee worden exclusieve keuzen voorgesteld. Wanneer u een optie in een groep keuzerondjes selecteert, worden alle andere opties in de groep uitgeschakeld (een groep bestaat uit twee of meer knoppen met dezelfde naam). In het onderstaande voorbeeld is de optie Raften geselecteerd. Als de gebruiker op Surfen klikt, wordt de optie Raften automatisch uitgeschakeld.
Lijstmenu's
Geven optiewaarden weer in een bladerlijst waarin gebruikers meerdere opties kunnen selecteren. De optie Lijst geeft de optiewaarden weer in een menu waarin gebruikers slechts één item kunnen selecteren. Gebruik menu's wanneer u beperkte ruimte hebt en toch veel items moet weergeven, of als u de waarden die aan de server worden geretourneerd, moet controleren. In tegenstelling tot tekstvelden, waarin gebruikers alles kunnen typen wat ze willen, zelfs ongeldige gegevens, stelt u de exacte waarden in die door een menu worden geretourneerd.
Een pop-upmenu in een HTML-formulier is niet hetzelfde als een grafisch pop-upmenu. Voor informatie over het maken, bewerken en weergeven of verbergen van een grafisch pop-upmenu volgt u de koppeling aan het einde van deze sectie.
Snelmenu's
Navigeerbare lijsten of pop-upmenu's waarmee u een menu kunt invoegen waarin elke optie is gekoppeld aan een document of bestand.
Bestandsvelden
Hiermee kunnen gebruikers naar een bestand op hun computer bladeren en het bestand als formuliergegevens uploaden.
Afbeeldingsvelden
Kunt u een afbeelding in een formulier invoegen. Gebruik afbeeldingsvelden om grafische knoppen te maken zoals de knoppen Verzenden of Beginwaarden. Wanneer u een afbeelding gebruikt om andere taken dan het verzenden van gegevens uit te voeren, moet u een gedrag aan het formulierobject koppelen.
(Alleen Creative Cloud-gebruikers): Er zijn nieuwe kenmerken aan het deelvenster Eigenschappen voor formulierelementen toegevoegd als onderdeel voor ondersteuning van HTML5. Daarnaast zijn er vier nieuwe formulierelementen (E-mail, Zoeken, Telefoon, URL) toegevoegd aan de sectie Formulieren van het deelvenster Invoegen. Zie Verbeterde HTML5-ondersteuning voor formulierelementen voor meer informatie.
In de ontwerpweergave worden formulieren aangeduid met een gestippelde rode omtrek. Als u deze omtrek niet ziet, kiest u Weergave > Visuele hulpmiddelen > Onzichtbare elementen.
Stel de eigenschappen van het HTML-formulier in de eigenschappencontrole in (Venster > Eigenschappen):
a. Klik in het documentvenster op de formulieromtrek om het formulier te selecteren.
b. Typ in het vak Formuliernaam een unieke naam voor het formulier.
Door een formulier een naam te geven, kunt u er met een scripttaal, zoals JavaScript of VBScript, naar verwijzen of het besturen. Als u het formulier geen naam geeft, genereert Dreamweaver een naam volgens het patroon formn, waarbij de waarde van n wordt verhoogd voor elk formulier dat aan de pagina wordt toegevoegd.
c. Geef in het vak Actie de pagina of het script op dat de formuliergegevens verwerkt. Daartoe typt u het pad of klikt u op het mappictogram om naar de desbetreffende pagina of het juiste script te navigeren. Voorbeeld: processorder.php.
d. Geef in het pop-upmenu Methode de methode op waarmee de formuliergegevens naar de server worden overgebracht.
Stel vervolgens de volgende opties naar wens in:
Standaard Met deze optie wordt de standaardinstelling van de browser gebruikt om de formuliergegevens naar de server te verzenden. De methode GET is de standaardmethode.
GET Hiermee wordt de waarde toegevoegd aan de URL die de pagina opvraagt.
POST Hiermee worden de formuliergegevens in het HTTP-verzoek ingesloten.
Gebruik GET niet om lange formulieren te verzenden. URL's zijn beperkt tot 8192 tekens. Als de hoeveelheid verzonden gegevens te groot is, worden gegevens afgekapt, wat onverwachte of geen resultaten oplevert.
U kunt bladwijzers toevoegen aan dynamische pagina's die zijn gegenereerd door parameters doorgegeven via de methode GET, omdat alle benodigde waarden voor het opnieuw genereren van de pagina zijn opgenomen in de URL die in het adresvak van de browser wordt weergegeven. Dynamische pagina's die worden gegenereerd door parameters die met de methode POST zijn doorgegeven, kunnen echter niet met een bladwijzer worden gemarkeerd.
Als u vertrouwelijke gebruikersnamen en wachtwoorden, creditcardnummers of andere vertrouwelijke informatie verzamelt, lijkt de methode POST misschien veiliger dan de methode GET. De informatie die met de methode POST wordt verzonden, is echter niet gecodeerd en kan eenvoudig door een hacker worden onderschept. Gebruik een beveiligde verbinding met een beveiligde server als u veiligheid wilt waarborgen.
e. (Optioneel) Geef in het pop-upmenu Enctype het MIME-coderingstype op van de gegevens die voor verwerking naar de server worden verzonden.
De standaardinstelling van application/x-www-form-urlencode wordt gewoonlijk gebruikt in combinatie met de methode POST. Als u een veld voor het laden van een bestand maakt, geeft u het MIME-type multipart/form‑data op.
f. (Optioneel) Geef in het pop-upmenu Doel het venster op waarin u de gegevens wilt weergeven die door het geactiveerde programma worden geretourneerd.
Als het genoemde venster nog niet is geopend, wordt een nieuw venster met die naam geopend. Stel een van de volgende doelwaarden in:
_blank Hiermee wordt het doeldocument in een nieuw, naamloos venster geopend.
_parent Hiermee wordt het doeldocument geopend in het bovenliggende venster van het venster waarin het huidige document wordt weergegeven.
_self Hiermee wordt het doeldocument geopend in hetzelfde venster als het venster waarin het formulier is verzonden.
_top Hiermee wordt het doeldocument geopend in het huidige venster. Deze waarde kan worden gebruikt om ervoor te zorgen dat het doeldocument het volledige venster overneemt, zelfs als het originele document in een frame wordt weergegeven.
Voeg formulierobjecten op de pagina in:
a. Plaats de invoegpositie op de plaats waar het formulierobject in het formulier moet worden weergegeven.
b. Selecteer het object in het menu Invoegen > Formulier of in de categorie Formulieren van het deelvenster Invoegen.
c. Geef de waarden op in het dialoogvenster Toegankelijkheidskenmerken van de invoertag. Klik in het dialoogvenster op Help voor meer informatie.
Als het dialoogvenster Toegankelijkheidskenmerken van de invoertag niet wordt weergegeven, was mogelijk de codeweergave actief voor het invoegpunt toen u hebt geprobeerd om het formulierobject in te voegen. Controleer of de ontwerpweergave actief is voor het invoegpunt en probeer het opnieuw. Meer informatie over dit onderwerp vindt u in het artikel van David Powers, Creating HTML forms in Dreamweaver.
d. Stel de eigenschappen van de objecten in.
e. Voer een naam voor het object in de eigenschappencontrole in.
Elk tekstveld, verborgen veld, selectievakje en lijst-/menuobject moet een unieke naam hebben die het object in het formulier aanduidt. Namen van formulierobjecten mogen geen spaties of speciale tekens bevatten. U kunt elke combinatie van alfanumerieke tekens en een onderstrepingsteken (_) gebruiken. De label die u aan het object toekent, is de naam van de variabele waarin de waarde van het veld (het ingevoerde gegeven) is opgeslagen. Dit is de waarde die voor verwerking naar de server wordt verzonden.
Alle keuzerondjes in een groep moeten dezelfde naam hebben.
f. Als u het tekstveld-, selectievakje- of keuzerondje-object op de pagina een label wilt geven, klikt u naast het object en typt u de label.
Gebruik regeleinden, alinea-einden, vooraf opgemaakte tekst of tabellen om uw formulieren op te maken. U kunt geen formulier in een ander formulier invoegen (u kunt tags dus niet overlappen), maar u kunt wel meer dan één formulier op een pagina opnemen.
Vergeet niet om bij het ontwerpen van formulieren de formuliervelden van een beschrijvende tekstlabel te voorzien, zodat gebruikers weten wat ze moeten invoeren, bijvoorbeeld “Typ uw naam” als u de naam wilt verkrijgen.
Gebruik tabellen om formulierobjecten en veldlabels te structureren. Wanneer u tabellen in formulieren gebruikt, moet u ervoor zorgen dat alle table-tags zijn opgenomen tussen form-tags.
Ga naar www.adobe.com/go/vid0160_nl voor een zelfstudie over formulieren maken.
Ga naar www.adobe.com/go/vid0161_nl voor een zelfstudie over stijlformulieren met CSS.
Selecteer het tekstveldobject en stel de volgende opties in de eigenschappencontrole in:
Tekenbreedte
Hiermee geeft u het maximaal aantal tekens op dat in het veld kan worden weergegeven. Deze waarde kan kleiner zijn dan Maximum aantal tekens, het maximum aantal tekens dat in het veld kan worden ingevoerd. Als Tekenbreedte bijvoorbeeld is ingesteld op 20 (de standaardwaarde) en een gebruiker 100 tekens invoert, zijn slechts 20 tekens in het tekstveld zichtbaar. De tekens worden wel door het veldobject herkend en voor verwerking naar de server verzonden, ook al kunt u ze niet in het veld zien.
Maximum aantal tekens
Hiermee bepaalt u het maximum aantal tekens dat de gebruiker in het veld kan invoeren voor tekstvelden die uit één regel bestaan. Gebruik Maximum aantal tekens bijvoorbeeld om postcodes te beperken tot 6 tekens, om wachtwoorden te beperken tot 10 tekens enzovoort. Als u het vak Maximum aantal tekens leeg laat, kunnen gebruikers een willekeurige hoeveelheid tekst invoeren. Als de tekst langer is dan de tekenbreedte van het veld, loopt de tekst door. Als een gebruiker het maximum aantal tekens overschrijdt, is een signaal hoorbaar.
Aantal lijnen
Met deze optie, die beschikbaar is wanneer de optie Meerdere regels is geselecteerd, stelt u de hoogte in van het veld voor tekstvelden met meerdere regels.
Uitgeschakeld
Hiermee schakelt u het tekstgebied uit.
Alleen-lezen
Hiermee verandert u het tekstgebied in een alleen-lezen tekstgebied.
Type
Hiermee geeft u aan of het veld een veld van één regel, een veld van meerdere regels of een wachtwoordveld is.
Eén regel
Dit resulteert in een input-tag waarvan het kenmerk type is ingesteld op text. De instelling Tekenbreedte komt overeen met het kenmerk size en de instelling Maximum aantal tekens komt overeen met het kenmerk maxlength.
Meerdere regels
Dit resulteert in een textarea-tag. De instelling Tekenbreedte komt overeen met het kenmerk cols en de instelling Aantal regels komt overeen met het kenmerk rows.
Wachtwoord
Dit resulteert in een input-tag waarvan het kenmerk type is ingesteld op text. De instellingen Tekenbreedte en Maximum aantal tekens komen overeen met dezelfde kenmerken als in tekstvelden van één regel. Wanneer een gebruiker tekst in een wachtwoordveld typt, wordt de invoer als sterretjes of opsommingstekens weergegeven zodat anderen de invoer niet kunnen zien.
Beginwaarde
Hiermee kent u de waarde toe die in het veld wordt weergegeven wanneer het formulier de eerste keer wordt geladen. U kunt bijvoorbeeld opgeven dat de gebruiker informatie in het veld invoert door een opmerking of voorbeeldgegeven op te nemen.
Klasse
Hiermee kunt u CSS-regels op het object toepassen.
Knopnaam
Hiermee geeft u de knop een naam. Met de twee gereserveerde namen, Verzenden en Beginwaarden, kunt u respectievelijk opgeven dat de formuliergegevens moeten worden verzonden naar de toepassing of het script dat de gegevens verwerkt, of dat alle formuliervelden moeten worden teruggezet op hun beginwaarden.
Waarde
Hiermee geeft u de tekst op die op de knop moet worden weergegeven.
Actie
Hiermee bepaalt u wat er gebeurt wanneer op de knop wordt geklikt.
Formulier verzenden
Wanneer de gebruiker op de knop klikt, worden de formuliergegevens voor verwerking verzonden. De gegevens worden verzonden naar de pagina of het script dat in de eigenschap Actie van het formulier is opgegeven.
Formulier op beginwaarden instellen
Wanneer de gebruiker op de knop klikt, wordt de inhoud van het formulier gewist.
Geen
Hiermee bepaalt u de actie die moet worden uitgevoerd wanneer op de knop wordt geklikt. U kunt bijvoorbeeld een JavaScript-gedrag toevoegen dat een andere pagina opent wanneer de gebruiker op de knop klikt.
Klasse
Hiermee worden CSS-regels op het object toegepast.
Geselecteerde waarde
Hiermee stelt u de waarde in die naar de server wordt verzonden wanneer het selectievakje is ingeschakeld. In een onderzoek kunt u bijvoorbeeld de waarde 4 instellen voor 'Helemaal mee eens' en de waarde 1 voor 'Helemaal niet mee eens'.
Status bij openen
Hiermee bepaalt u of het selectievakje is ingeschakeld wanneer het formulier in de browser wordt geladen.
Dynamisch
Hiermee laat u de server dynamisch de begintoestand van het selectievakje bepalen. U kunt selectievakjes bijvoorbeeld gebruiken om de Ja/Nee-informatie die in een databaserecord is opgeslagen, visueel voor te stellen. Die informatie is in de ontwerpfase nog niet bekend. In runtime leest de server de databaserecord en wordt het selectievakje ingeschakeld als de waarde Ja is.
Klasse
Hiermee worden de CSS-regels (Cascading Style Sheets) op het object toegepast.
Geselecteerde waarde
Hiermee stelt u de waarde in die naar de server wordt verzonden wanneer het keuzerondje is ingeschakeld. Typ bijvoorbeeld skiën in het vak Geselecteerde waarde om aan te geven dat een gebruiker skiën heeft gekozen.
Status bij openen
Hiermee bepaalt u of het keuzerondje is ingeschakeld wanneer het formulier in de browser wordt geladen.
Dynamisch
Hiermee laat u de server dynamisch de begintoestand van het keuzerondje bepalen. Met keuzerondjes kunt u bijvoorbeeld informatie die in een databaserecord is opgeslagen, visueel voorstellen. Die informatie is in de ontwerpfase nog niet bekend. In runtime leest de server de databaserecord en wordt het keuzerondje ingeschakeld als de waarde overeenkomt met een door u opgegeven waarde.
Klasse
Hiermee worden CSS-regels op het object toegepast.
Lijst/Menu
Hiermee geeft u het menu een naam. De naam moet uniek zijn.
Type
Hiermee geeft u aan of het menu wordt geopend wanneer erop wordt geklikt (optie Menu), of als een lijst met items wordt weergegeven (optie Lijst). Kies de optie Menu als u wilt dat maar één optie zichtbaar is wanneer het formulier in een browser wordt weergegeven. Om de andere opties weer te geven, moet de gebruiker op de vervolgkeuzepijl klikken.
Kies de optie Lijst als u enkele of alle opties wilt weergeven wanneer het formulier in een browser wordt weergegeven, en als gebruikers meerdere items kunnen selecteren.
Hoogte
(Alleen type Lijst) Hiermee stelt u in hoeveel items in het menu worden weergegeven.
Selecties
(Alleen type Lijst) Hiermee geeft u aan of de gebruiker meerdere items in de lijst kan selecteren.
Lijstwaarden
Hiermee opent u een dialoogvenster waarmee u de items aan een formuliermenu kunt toevoegen:
Gebruik de plus- en minknop (+ en -) om items aan de lijst toe te voegen of uit de lijst te verwijderen.
Voer labeltekst en een optionele waarde voor elk menu-item in.
Elk item in de lijst heeft een label (de tekst die in de lijst staat) en een waarde (de waarde die wordt verstuurd naar de verwerkende toepassing als het item wordt geselecteerd). Als geen waarde is opgeven, wordt de label naar de verwerkende toepassing verstuurd.
Gebruik de knoppen pijl-omhoog en -omlaag als u de volgorde van de items in de lijst wilt wijzigen.
De volgorde van de items in het menu komt overeen met die in het dialoogvenster Lijstwaarden. Het eerste item in de lijst is het item dat is geselecteerd wanneer de pagina in een browser wordt geladen.
Dynamisch
Hiermee laat u de server dynamisch een item in het menu selecteren wanneer het formulier de eerste keer wordt weergegeven.
Klasse
Hiermee kunt u CSS-regels op het object toepassen.
In eerste instantie geselecteerd
Hiermee stelt u de items in die standaard in de lijst zijn geselecteerd. Klik op een of meer items in de lijst.
U kunt een veld voor het laden van bestanden maken waarmee gebruikers een bestand op hun computer (bijvoorbeeld een tekstverwerkingsdocument of grafisch bestand) kunnen selecteren en naar de server kunnen uploaden. Een bestandsveld ziet er net zo uit als andere tekstvelden, maar heeft eveneens een knop Bladeren. De gebruiker voert het pad naar het te laden bestand handmatig in of gebruikt de knop Bladeren om het bestand te zoeken en te selecteren.
Voordat u velden voor het laden van bestanden kunt gebruiken, moet u een script aan serverzijde of een pagina hebben die het verzenden van bestanden kan afhandelen. Raadpleeg de documentatie bij de servertechnologie die u gebruikt voor de verwerking van formuliergegevens. Als u bijvoorbeeld PHP gebruikt, raadpleegt u “Handling files uploads” in de online-PHP-handleiding op http://us2.php.net/features.file-upload.php.
Voor bestandsvelden moet u de methode POST gebruiken om bestanden van de browser naar de server over te brengen. Het bestand wordt gepost naar het adres dat u in het vak Actie van het formulier hebt opgegeven.
Neem contact op met de serverbeheerder om te vragen of bestanden anoniem geladen mogen worden voordat u het bestandsveld gebruikt.
Naam bestandsveld
Hiermee geeft u de naam voor het bestandsveldobject op.
Tekenbreedte
Hiermee geeft u het maximaal aantal tekens op dat in het veld kan worden weergegeven.
Maximum aantal tekens
Hiermee geeft u het maximum aantal tekens op dat het veld kan bevatten. Als de gebruiker het bestand met de bladerknop zoekt, kan de bestandsnaam inclusief het pad de waarde van Maximum aantal tekens overschrijden. Als de gebruiker de bestandsnaam en het pad echter probeert in te voeren, accepteert het bestandsveld niet meer tekens dan met de waarde Maximum aantal tekens is opgegeven.
U kunt afbeeldingen als knoppictogrammen gebruiken. Wanneer u een afbeelding gebruikt om andere taken dan het verzenden van gegevens uit te voeren, moet u een gedrag aan het formulierobject koppelen.
Het dialoogvenster Afbeeldingsbron selecteren wordt geopend.
Afbeeldingsveld
Hiermee geeft u de knop een naam. Met de twee gereserveerde namen, Verzenden en Beginwaarden, kunt u respectievelijk opgeven dat de formuliergegevens moeten worden verzonden naar de toepassing of het script dat de gegevens verwerkt, of dat alle formuliervelden moeten worden teruggezet op hun beginwaarden.
Bron
Hiermee geeft u de afbeelding op die u voor de knop wilt gebruiken.
Alt
Hier kunt u beschrijvende tekst invoeren voor het geval de afbeelding niet in de browser kan worden geladen.
Uitlijnen
Hiermee stelt u het uitlijningskenmerk van het object in.
Afbeelding bewerken
Hiermee start u de standaardafbeeldingseditor en wordt het afbeeldingsbestand voor bewerken geopend.
Klasse
Hiermee kunt u CSS-regels op het object toepassen.
Verborgen veld
Hiermee geeft u de naam voor het veld op.
Waarde
Hiermee kent u een waarde toe aan het veld. Deze waarde wordt aan de server doorgegeven wanneer het formulier wordt verzonden.
Selecteer Invoegen > Formulier > Groep keuzerondjes.
Vul het dialoogvenster in en klik op OK.
a. Voer in het vak Naam een naam voor de groep keuzerondjes in.
Als u de keuzerondjes instelt om parameters aan de server terug te geven, worden de parameters aan de naam gekoppeld. Als u de groep bijvoorbeeld mijnGroep noemt en de formuliermethode instelt op GET (en dus wilt dat het formulier URL-parameters doorgeeft in plaats van formulierparameters wanneer de gebruiker op de verzendknop klikt), wordt de expressie mijnGroep="CheckedValue" in de URL aan de server doorgegeven.
b. Klik op de plusknop (+) om een keuzerondje aan de groep toe te voegen. Voer een label en geselecteerde waarde voor de nieuwe knop in.
c. Klik op de pijl-omhoog of de pijl-omlaag als u de volgorde van de knoppen wilt wijzigen.
d. Als u wilt dat een bepaald keuzerondje is ingeschakeld wanneer de pagina in een browser wordt geopend, typt u een waarde in het vak Selecteer waarde gelijk aan, die gelijk is aan de waarde van het keuzerondje.
Voer een statische waarde in of geef een dynamische waarde op door op het pictogram met de bliksemflits naast het vak te klikken en een recordset te selecteren die mogelijke geselecteerde waarden bevat. In beide gevallen moet de waarde die u opgeeft, overeenkomen met de geselecteerde waarde van een van de keuzerondjes in de groep. Als u de ingeschakelde waarden van de keuzerondjes wilt bekijken, schakelt u de keuzerondjes een voor een in en opent u telkens de eigenschappencontrole (Venster > Eigenschappen).
e. Selecteer het formaat waarin u de knoppen in Dreamweaver wilt indelen. Deel de knoppen in met regeleinden of met een tabel. Als u de tabeloptie kiest, maakt Dreamweaver een tabel met één kolom en worden de keuzerondjes links en de labels rechts geplaatst.
U kunt de eigenschappen in de eigenschappencontrole of rechtstreeks in de codeweergave instellen.
Selecteer Invoegen > Formulier > Groep Selectievakjes.
Vul het dialoogvenster in en klik op OK.
a. Voer in het vak Naam een naam voor de groep selectievakjes in.
Als u de selectievakjes instelt om parameters aan de server terug te geven, worden de parameters aan de naam gekoppeld. Als u de groep bijvoorbeeld mijnGroep noemt en de formuliermethode instelt op GET (en dus wilt dat het formulier URL-parameters doorgeeft in plaats van formulierparameters wanneer de gebruiker op de verzendknop klikt), wordt de expressie mijnGroep="CheckedValue" in de URL aan de server doorgegeven.
b. Klik op de plusknop (+) om een selectievakje aan de groep toe te voegen. Voer een label en geselecteerde waarde voor het nieuwe selectievakje in.
c. Klik op de pijl-omhoog of de pijl-omlaag als u de volgorde van de selectievakjes wilt wijzigen.
d. Als u wilt dat een bepaald selectievakje is ingeschakeld wanneer de pagina in een browser wordt geopend, typt u een waarde in het vak Selecteer waarde gelijk aan, die gelijk is aan de waarde van het selectievakje.
Voer een statische waarde in of geef een dynamische waarde op door op het pictogram met de bliksemflits naast het vak te klikken en een recordset te selecteren die mogelijke geselecteerde waarden bevat. In beide gevallen moet de waarde die u opgeeft, overeenkomen met de geselecteerde waarde van een van de selectievakjes in de groep. Als u de ingeschakelde waarden van de selectievakjes wilt bekijken, schakelt u de selectievakjes een voor een in en opent u telkens de eigenschappencontrole (Venster > Eigenschappen).
e. Selecteer het formaat waarin u de selectievakjes in Dreamweaver wilt indelen.
Deel de selectievakjes in met regeleinden of met een tabel. Als u de tabeloptie kiest, maakt Dreamweaver een tabel met één kolom en worden de selectievakjes links en de labels rechts geplaatst.
U kunt de eigenschappen in de eigenschappencontrole of rechtstreeks in de codeweergave instellen.
Een dynamisch-formulierobject is een formulierobject waarvan de begintoestand door de server wordt bepaald op het moment dat de pagina bij de server wordt aangevraagd. De toestand wordt dus niet in de ontwerpfase door de ontwerper bepaald. Wanneer een gebruiker bijvoorbeeld een PHP-pagina aanvraagt die een formulier met een menu bevat, wordt het menu automatisch door een PHP-script op de pagina gevuld met waarden die in een database zijn opgeslagen. De server verzendt de ingevulde pagina vervolgens naar de browser van de gebruiker.
Het onderhoud van een site kan eenvoudiger worden wanneer formulierobjecten dynamisch zijn. Veel sites gebruiken bijvoorbeeld menu's om gebruikers een reeks opties aan te bieden. Als het menu dynamisch is, kunt u de menu-items op een enkele plaats toevoegen, verwijderen of wijzigen, namelijk in de databasetabel waarin de items zijn opgeslagen, om alle instanties van hetzelfde menu op de site bij te werken.
U kunt een HTML-formuliermenu of -lijstmenu dynamisch vullen met elementen uit een database. Voor de meeste pagina's kunt u een HTML-menuobject gebruiken.
Voordat u begint, moet u een HTML-formulier op een ColdFusion-, PHP, - of ASP-pagina invoegen, en moet u een recordset of andere bron van dynamische inhoud voor het menu definiëren.
Voeg een HTML-lijst/menu formulierobject op de pagina in:
a. Klik in het HTML-formulier op de pagina (Invoegen > Formulier > Formulier).
b. Kies Invoegen > Formulier > Lijst/Menu om het formulierobject in te voegen.
Voer een van de volgende handelingen uit:
Selecteer de nieuwe of een bestaande HML-lijst/menu formulierobject en klik dan op de knop Dynamisch eigenschappencontrole.
Selecteer Invoegen > Gegevensobjecten > Dynamische gegevens > Dynamische selectielijst
Vul het dialoogvenster Dynamische lijst/menu in en klik op OK.
a. Selecteer in het pop-upmenu Opties uit recordset de recordset die u als inhoudsbron wilt gebruiken. U moet dit menu ook gebruiken als u de items in zowel het statische als het dynamische menu of in de lijst wilt bewerken.
b. Voer in het gebied Statische opties een standaarditem in de lijst of het menu in. Gebruik deze optie ook als u de statische vermeldingen in een lijst/menuformulierobject wilt bewerken nadat u dynamische inhoud hebt toegevoegd.
c. (Optioneel) Gebruik de plus- en minknop (+ en -) om items aan de lijst toe te voegen of uit de lijst te verwijderen. De items staan in dezelfde volgorde als in het dialoogvenster Beginlijstwaarden. Het eerste item in de lijst is het item dat is geselecteerd wanneer de pagina in een browser wordt geladen. Gebruik de knoppen pijl-omhoog en -omlaag als u de volgorde van de items in de lijst wilt wijzigen.
d. Selecteer in het pop-upmenu Waarden het veld dat de waarden van de menu-items bevat.
e. Selecteer in het pop-upmenu Labels het veld dat de tags voor de menu-items bevat.
f. (Optioneel) Als u wilt opgeven dat een bepaald menu-item geselecteerd moet zijn wanneer de pagina in een browser wordt geopend of wanneer een record in het formulier wordt weergegeven, voert u in het vak Selecteer waarde gelijk aan een waarde in die gelijk is aan de waarde van het menu-item.
U kunt een statische waarde invoeren, of u kunt een dynamische waarde opgeven door op het pictogram met de bliksemflits naast het vak te klikken en een dynamische waarde te selecteren in de lijst met gegevensbronnen. In beide gevallen moet de waarde die u opgeeft, overeenkomen met de waarde van een van de menu-items.
U kunt dynamische inhoud in HTML-tekstvelden weergeven wanneer het formulier in een browser wordt weergegeven.
Voordat u begint, moet u het HTML-formulier maken op een ColdFusion-, PHP, - of ASP-pagina, en moet u een recordset of andere bron van dynamische inhoud voor het tekstveld definiëren.
De gegevensbron moet tekstuele informatie bevatten. Als de lijst geen gegevensbronnen bevat of als de beschikbare gegevensbronnen niet geschikt zijn, klikt u op de plusknop (+) om een nieuwe gegevensbron te definiëren.
U kunt de server laten bepalen of een selectievakje moet worden ingeschakeld wanneer het formulier in een browser wordt weergegeven.
Voordat u begint, moet u het HTML-formulier maken op een ColdFusion-, PHP, - of ASP-pagina, en moet u een recordset of andere bron van dynamische inhoud voor de selectievakjes definiëren. In het beste geval moet de inhoudsbron Booleaanse gegevens bevatten, zoals Ja/Nee of waar/onwaar.
Klik op het pictogram met de bliksemflits naast het vakje Inschakelen indien, en selecteer het veld in de lijst met gegevensbronnen.
De gegevensbron moet Booleaanse gegevens bevatten, zoals Yes en No of true en false. Als de lijst geen gegevensbronnen bevat of als de beschikbare gegevensbronnen niet geschikt zijn, klikt u op de plusknop (+) om een nieuwe gegevensbron te definiëren.
Voer de waarde in het vak Gelijk aan in, die het veld moet hebben opdat het selectievakje wordt ingeschakeld.
Als u bijvoorbeeld wilt dat het selectievakje wordt ingeschakeld wanneer een specifiek veld in een record de waarde Ja heeft, moet u Ja in het vak Gelijk aan invullen.
Deze waarde wordt eveneens aan de server geretourneerd als de gebruiker op de verzendknop van het formulier klikt.
Selecteer vooraf dynamisch een HTML-keuzerondje wanneer een record in het HTML-formulier in een browser wordt weergegeven.
Voordat u begint, moet u het formulier op een ColdFusion-, PHP-, - of ASP-pagina maken en minstens één groep HTML-keuzerondjes invoegen (Invoegen > Formulier > Groep keuzerondjes). U moet eveneens een recordset of andere bron van dynamische inhoud voor de keuzerondjes definiëren. In het beste geval moet de inhoudsbron Booleaanse gegevens bevatten, zoals Ja/Nee of waar/onwaar.
In het vak Waarden voor keuzerondjes worden de waarden van alle keuzerondjes in de groep weergegeven.
De recordset die u selecteert, bevat waarden die overeenkomen met de geselecteerde waarden van de keuzerondjes. Als u de ingeschakelde waarden van de keuzerondjes wilt bekijken, schakelt u de keuzerondjes een voor een in en opent u telkens de eigenschappencontrole (Venster > Eigenschappen).
Vul het dialoogvenster Dynamische gegevens in en klik op OK.
a. Selecteer een gegevensbron in de lijst met gegevensbronnen.
b. (Optioneel) Selecteer een gegevensopmaak voor de tekst.
c. (Optioneel) Wijzig de code die Dreamweaver op de pagina invoegt om de dynamische tekst weer te geven.
In Dreamweaver kunt u JavaScript-code toevoegen die de inhoud van opgegeven tekstvelden controleert om na te gaan of de gebruiker het juiste type gegevens heeft ingevoerd.
U kan Spry-formulierwidgets gebruiken om uw formulieren te maken en de inhoud van de opgegeven formulierelementen te valideren. Raadpleeg de onderstaande Spry-onderwerpen voor meer informatie.
U kunt in Dreamweaver ook ColdFusion-formulieren maken die de inhoud van opgegeven velden controleren. Raadpleeg het onderstaande ColdFusion-hoofdstuk voor meer informatie.
Zorg ervoor dat elk tekstveld dat u wilt controleren, een unieke naam heeft.
U kunt bijvoorbeeld opgeven dat in een tekstveld voor de leeftijd van een persoon alleen cijfers mogen worden ingevoerd.
Het gedrag Formulier valideren is alleen beschikbaar als het document een tekstveld bevat.
U kunt JavaScript-gedrag dat is opgeslagen in Dreamweaver, koppelen aan HTML-formulierobjecten, zoals knoppen.
Sommige formulieren gebruiken JavaScript of VBScript om de verwerking van formulieren of andere acties op de client uit te voeren in plaats van de formuliergegevens voor verwerking naar de server te versturen. U kunt Dreamweaver gebruiken om een formulierknop te configureren om een specifiek script op de client uit te voeren wanneer de gebruiker op de knop klikt.
U kunt bijvoorbeeld de naam invoeren van een functie die nog niet bestaat, zoals processMyForm().
U kunt bijvoorbeeld de volgende JavaScript-functie in de hoofdsectie van het document definiëren om een bericht weer te geven wanneer de gebruiker op de verzendknop klikt:
function processMyForm(){ alert('Thanks for your order!'); }
Wanneer u een HTML-formulierobject invoegt, kunt u het formulierobject toegankelijk maken en de toegankelijkheidskenmerken later wijzigen.
Deze stap hoeft u maar één keer uit te voeren.
Het dialoogvenster Toegankelijkheidskenmerken van de invoertag wordt geopend.
De schermlezer leest de naam die u invoert, als het kenmerk Label voor het object.
ID
Hiermee kent u een id toe aan het formulierveld. Deze waarde kan worden gebruikt om vanuit JavaScript naar het veld te verwijzen. De waarde wordt eveneens gebruikt als de waarde van het for-kenmerk als u onder de Stijl-opties de optie Labeltag koppelen met het kenmerk 'for' kiest.
Terugloop met labeltag
Hiermee plaatst u als volgt een labeltag rond het formulieritem:
<label> <input type="radio" name="radiobutton" value="radiobutton"> RadioButton1</label>Labeltag koppelen met het kenmerk 'for'
Als u deze optie kiest, wordt het for-kenmerk gebruikt om een labeltag als volgt rond het formulieritem te plaatsen:
<input type="radio" name="radiobutton" value="radiobutton" id="radiobutton"> <label for="radiobutton">RadioButton2</label>
Bij deze keuze geeft de browser tekst die aan een selectievakje of keuzerondje is gekoppeld, weer in een focusrechthoek, en kan de gebruiker het selectievakje of keuzerondje inschakelen door ergens in de desbetreffende tekst te klikken in plaats van precies op het selectievakje of het keuzerondje.
Opmerking: deze optie heeft de voorkeur wat toegankelijkheid betreft. De functionaliteit kan echter per browser verschillen.
Geen labeltag
Bij deze optie wordt geen labeltag gebruikt, zoals hier:
<input type="radio" name="radiobutton" value="radiobutton"> RadioButton3Toegangstoets
Bij deze optie wordt een toetsenbordequivalent (één letter) en de Alt-toets (Windows) of de Control-toets (Mac) gebruikt om het formulierobject in de browser te selecteren. Als u bijvoorbeeld B als toegangstoets invoert, kunnen Mac-gebruikers in hun browser op Control+B drukken om het formulierobject te selecteren.
Tabindex
Hiermee bepaalt u de tabvolgorde voor de formulierobjecten. Als u de tabvolgorde voor één object instelt, moet u de tabvolgorde voor alle objecten instellen.
Het instellen van een tabvolgorde is handig wanneer de pagina nog andere koppelingen en formulierobjecten bevat en de gebruiker deze in een specifieke volgorde moet doorlopen.
Het formulierobject wordt in het document weergegeven.
Als u op Annuleren klikt, verschijnt het formulierobject in het document, maar worden er door Dreamweaver geen toegankelijkheidstags of -kenmerken aan gekoppeld.
Bewerk de desbetreffende kenmerken in de codeweergave.
Klik met de rechtermuisknop (Windows), of houd de Command-toets ingedrukt terwijl u klikt, en kies Tag bewerken.
Aanmelden bij je account