Selecteer Invoegen > Spry > Groep met Spry-validatiekeuzerondjes.
Laatst bijgewerkt op
May 02, 2021 11:27:22 PM GMT
Opmerking:
In Dreamweaver CC en hoger zijn Spry-widgets vervangen door jQuery-widgets. U kunt de bestaande Spry-widgets op uw pagina nog steeds wijzigen, maar u kunt geen nieuwe Spry-widgets toevoegen.
Over de widget groep met validatiekeuzerondjes
De widget groep met validatiekeuzerondjes is een groep keuzerondjes met validatieondersteuning voor de selectie. De widget bevestigt de selectie van een keuzerondje in de groep.
Hierna volgt een voorbeeld van een widget groep met validatiekeuzerondjes in verschillende staten.
A. Foutberichten bij de widget groep met validatiekeuzerondjes B. Widget groep met validatiekeuzerondjes
De widget groep met validatiekeuzerondjes bevat naast de oorspronkelijke staat nog drie staten: geldig, ongeldig en vereiste waarde. U kunt de eigenschappen van deze staten wijzigen door het bijbehorende CSS-bestand te bewerken (SpryValidationRadio.css), afhankelijk van de gewenste validatieresultaten. Een widget groep met validatiekeuzerondjes kan op verschillende momenten valideren: wanneer de gebruiker buiten de widget klikt, terwijl de gebruiker selecties maakt of wanneer de gebruiker het formulier probeert te verzenden.
Status bij openen
Wanneer de pagina in de browser wordt geladen of wanneer de gebruiker het formulier opnieuw instelt.
Toestand Geldig
Wanneer de gebruiker een selectie maakt en het formulier kan worden verzonden.
Toestand Vereist
Wanneer de gebruiker geen vereiste selectie heeft gemaakt.
Toestand Ongeldig
Wanneer de gebruiker een keuzerondje selecteert waarvan de waarde niet acceptabel is.
Wanneer een widget groep met validatiekeuzerondjes door een handeling van een gebruiker een van deze staten aanneemt, past de Spry-frameworklogica tijdens de uitvoering een specifieke CSS-klasse toe op de HTML-container voor de widget. Als een gebruiker bijvoorbeeld een formulier probeert te verzenden, maar geen selecties heeft gemaakt, past Spry een klasse op de widget toe waardoor het foutbericht “Selecteer een optie” wordt weergegeven. De regels die de opmaak en weergavestaten van foutberichten bepalen, staan in het bestand dat bij de widget hoort, SpryValidationRadio.css.
De standaard-HTML-code voor de widget groep met validatiekeuzerondjes, meestal in een formulier, bestaat uit een container span-tag om de tag input type="radio" van de groep keuzerondjes heen. De HTML-code voor de widget Groep met validatiekeuzerondjes bevat ook script-tags in de koptekst van het document en na de HTML-code van de widget.
Zie www.adobe.com/go/learn_dw_spryradio_nl voor een uitgebreidere uitleg van de werking van de widget Groep met validatiekeuzerondjes, inclusief een volledige anatomie van de code van de widget Groep met validatiekeuzerondjes.
De widget groep met validatiekeuzerondjes invoegen en bewerken
De widget groep met validatiekeuzerondjes invoegen
-
-
Typ in het tekstvak Naam een naam voor de groep keuzerondjes.
-
Keuzerondjes toevoegen aan of verwijderen uit de groep door op de plusknop (+) of minknop (-) te klikken.
-
Klik in de kolom Label op de naam van een keuzerondje om het bewerkbaar te maken en wijs een unieke naam toe aan elk keuzerondje.
-
Klik in de kolom Waarde op een waarde om deze bewerkbaar te maken en wijs een unieke waarde toe aan elk keuzerondje.
-
(Optioneel) Klik op een keuzerondje of op de bijbehorende waarde om een specifieke rij te selecteren en klik op de pijl omhoog of omlaag om de rij naar boven of naar beneden te verplaatsen.
-
Selecteer een lay-outtype voor de groep keuzerondjes.
Regeleinden
Plaatst elk keuzerondje op een afzonderlijke regel met behulp van regeleinden (br-tags).
Tabel
Plaatst elk keuzerondje op een afzonderlijke regel met behulp van de individuele rijen in de tabel (tr-tags).
-
Klik op OK.
Opmerking:
U kunt een widget groep keuzerondjes ook invoegen met behulp van de categorie Spry in het deelvenster Invoegen.
Opgeven wanneer validatie wordt uitgevoerd
U kunt opgeven wanneer de validatie wordt uitgevoerd; op het moment dat de gebruiker buiten de widget klikt, tijdens het opgeven van selecties of wanneer de gebruiker het formulier probeert te verzenden.
-
Selecteer een widget groep validatiekeuzerondjes in het documentvenster door op de blauwe tab te klikken.
-
Ga naar de eigenschappencontrole (Venster > Eigenschappen) en selecteer de optie die aangeeft wanneer de validatie moet worden uitgevoerd. U kunt alle opties of alleen Verzenden selecteren.
Vervagen
Valideert zodra de gebruiker buiten de groep keuzerondjes klikt.
Wijzigen
Valideert wanneer de gebruiker selecties maakt.
Verzenden
Valideert op het moment dat de gebruiker het formulier probeert te verzenden. De optie Verzenden is standaard geselecteerd en kan niet worden uitgeschakeld.
Widgettoestanden weergeven in de ontwerpweergave
-
Selecteer een widget groep validatiekeuzerondjes in het documentvenster door op de blauwe tab te klikken.
-
Ga naar de eigenschappencontrole (Venster > Eigenschappen) en selecteer de toestand die u wilt zien in het pop-upmenu Voorvertoningsstatus. Selecteer bijvoorbeeld Bij openen om de widget in de status bij openen weer te geven.
Status wijziging vereist voor keuzerondjes
Standaard moet de gebruiker bij een widget groep met validatiekeuzerondjes een selectie maken alvorens het formulier te verzenden. U kunt selecties echter optioneel maken voor de gebruiker.
-
Selecteer een widget groep validatiekeuzerondjes in het documentvenster door op de blauwe tab te klikken.
-
Schakel in de eigenschappencontrole (Venster > Eigenschappen) de optie Vereist in.
Een lege of ongeldige waarde opgeven
U kunt een waarde opgeven die als leeg of ongeldig wordt geregistreerd als de gebruiker een keuzerondje selecteert dat aan een van die waarden is gekoppeld. Als de gebruiker een keuzerondje met een lege waarde selecteert, geeft de browser het foutbericht “Selecteer een optie.” Als de gebruiker een keuzerondje met een ongeldige waarde selecteert, geeft de browser het foutbericht “Selecteer een geldige waarde.”
-
Selecteer het keuzerondje in de widget groep met keuzerondjes dat u wilt gebruiken als leeg of ongeldig keuzerondje. Wanneer u lege of ongeldige waarden voor de widget opgeeft, moet u eerst bijbehorende keuzerondjes maken waaraan die waarden al zijn toegewezen.
-
Wijs in de eigenschappencontrole voor keuzerondjes (Venster > Eigenschappen) aan het keuzerondje een geselecteerde waarde toe. Als u een keuzerondje met een lege waarde wilt maken, typt u geen in het vak Ingeschakelde waarde. Als u een keuzerondje met een ongeldige waarde wilt maken, typt u ongeldig in het vak Ingeschakelde waarde.
-
Selecteer de gehele widget groep met validatiekeuzerondjes door op de blauwe tab van de widget te klikken.
-
Geef in de eigenschappencontrole lege of ongeldige waarden op. Als u een widget wilt maken die het foutbericht voor lege waarden 'Selecteer een optie' weergeeft, typt u geen in het vak Lege waarde. Als u een widget wilt maken die het foutbericht voor ongeldige waarden 'Selecteer een geldige waarde' weergeeft, typt u ongeldig in het vak Ongeldige waarde.
Zowel aan het keuzerondje zelf als aan de widget groep met keuzerondjes moeten de waarden geen of ongeldig zijn toegewezen, anders worden deze berichten niet juist weergegeven.
De widget groep keuzerondjes aanpassen
Hoewel u vanuit de eigenschappencontrole eenvoudige bewerkingen in een widget groep met validatiekeuzerondjes kunt uitvoeren, worden aangepaste opmaaktaken niet ondersteund. U kunt de CSS-regels voor de widget groep met validatiekeuzerondjes wijzigen en een widget maken die naar uw eigen smaak is opgemaakt. Zie www.adobe.com/go/learn_dw_spryradio_custom_nl voor een uitgebreidere lijst met opmaaktaken.
Alle CSS-regels in de volgende onderwerpen verwijzen naar de standaardregels in het bestand SpryValidationRadio.css. Dreamweaver slaat het bestand SpryValidationRadio.css op in de map SpryAssets van uw site wanneer u een widget Groep met Spry-validatiekeuzerondjes maakt. Het is wellicht interessant om dit bestand te raadplegen omdat het nuttige informatie bevat over de diverse stijlen die u op de widget kunt toepassen.
Opmerking:
Hoewel u de regels voor de widget groep met validatiekeuzerondjes gemakkelijk rechtstreeks in het bijbehorende CSS-bestand kunt bewerken, kunt u ook het deelvenster CSS-stijlen gebruiken om de CSS van de widget te bewerken. Het deelvenster CSS-stijlen is handig om de CSS-klassen te zoeken die aan de verschillende onderdelen van dee widget zijn toegewezen, met name als u de modus Huidig van het paneel gebruikt.
Een widget groep met validatiekeuzerondjes opmaken (algemene instructies)
-
Open het bestand SpryValidationRadio.css.
-
Ga naar de CSS-regel voor het gedeelte van de widget dat u wilt wijzigen. Als u bijvoorbeeld de achtergrondkleur van de vereiste status van de widget groep keuzerondjes wilt wijzigen, bewerkt u de radioRequiredState-regel in het bestand SpryValidationRadio.css.
-
Breng de gewenste wijzigingen in de CSS-regel aan en sla het bestand op.
Het bestand SpryValidationRadio.css bevat een uitgebreid commentaar, waarin de code en het doel van bepaalde regels worden uitgelegd. Zie het commentaar in het bestand voor meer informatie.
Tekst opmaken van het foutbericht voor widget groep met validatiekeuzerondjes
Standaard worden foutberichten voor de widget groep met validatiekeuzerondjes rood weergegeven met een effen rand van 1 pixel breed om de tekst heen.
-
Als u de tekstopmaak van de foutberichten voor de widget groep met validatiekeuzerondjes wilt wijzigen, kunt u de desbetreffende CSS-regel aan de hand van de volgende tabel vinden. Vervolgens wijzigt u de standaardeigenschappen of voegt u uw eigen tekstopmaakeigenschappen en -waarden toe.
Op te maken tekst
Relevante CSS-regel
Relevante eigenschappen om te wijzigen
Tekst van foutbericht
.radioRequiredState .radioRequiredMsg, .radioInvalidState .radioInvalidMsg kleur: #CC3333; rand: 1px solid #CC3333;
Verwante informatie
Aanmelden bij je account