27 berichten aan het bekijken - 1 tot 27 (van in totaal 27)
  • Q:
    Bijdrager
    Robbes

    verplichte invoer html formulier…. Hoe?

    Hallo,

    Ik ben bezig met het maken van een HTML formulier. Ik wil graag dat enkele gegevens (zoals emailadres) verplicht moeten worden ingevuld voordat de gebuiker op verzend kan klikken.

    Ik kan nergens op het web een goede uitleg vinden. Weet iemand hoe ik dit moet aanpakken en of dit uberhaupt mogelijk is met alleen HTML?

    dank alvast….

    robbes

    Bijdrager
    Ovide

    Je kan dat op meerdere manieren toepassen met bijvoorbeeld javascript of php. Een javascript voorbeeld kan je hier meer vinden: http://www.thesitewizard.com/archive/validation.shtml Dit kan je prima gebruiken voor simpele formuliertjes. Als je het omzeilen ervan wilt voorkomen dan kan je je het beste gaan verdiepen in php (bijv. de if functie).

    Succes!

    Bijdrager
    iBert

    Bedoel je de volledige afhandeling van het formulier? Want als je het gaat verwerken heb je altijd een taal zoals ASP of PHP nodig.

    Bijdrager
    iRick

    Als je toevallig dreamweaver hebt:

    Je form selecteren
    Naar het Behaviours paneel gaan
    Op het + tekentje klikken
    Validate Form

    Bijdrager
    Robbes

    Bedoel je de volledige afhandeling van het formulier? Want als je het gaat verwerken heb je altijd een taal zoals ASP of PHP nodig.

    Nee, ik bedoel niet de afhandeling! dat kan ik doen met een standaard CGI – script van het hostingbedrijf.

    Waar het me om gaat is dat gebruikers die het formulier invullen, verplicht worden om enkele gegevens in te vullen. Anders kan het formulier niet verzonden worden.

    Bijdrager
    Robbes

    Beste Irick;

    Je form selecteren
    Naar het Behaviours paneel gaan
    Op het + tekentje klikken
    Validate Form

    Ik beschik over dreamweaver, je opmerking ws dan ook een goede hint…. voor tekstvakken heb ik dit inmiddels kunnen instellen!

    Het lukt me alleen niet om dit ook in te stellen bij checkboxes en radiobuttons. Als je zo weet hoe ik dat voor elkaar krijg….. alvast dankjewel,

    groet.

    Bijdrager
    Jordgubb

    Ik gebruik zelf een validatie routine die ik ‘geleend’ heb van David Fells.

    Zie: http://www.devarticles.com/c/a/HTML/DHTML-Form-Enhancement/

    Bijdrager
    iBert

    Ik zal je even een voorbeeldje geven dat ik gebruik, je kan de code dan gewoon knippen/plakken/aanpassen.

    Dit zet je in je header:

    [code:1:4d01a18abb]<script type="text/javascript">
    function validRequired(formField,fieldLabel)
    {
    var result = true;
    if (formField.value == "")
    {
    alert(’U gaf geen ‘ + fieldLabel + ‘ in. Gelieve dit te verbeteren.’); // dit is de boodschap die je kan aanpassen
    formField.focus();
    result = false;
    }
    return result;
    }
    function validateForm(theForm)
    {
    if (!validRequired(theForm.naam,"naam")) // hier verander je de veldnaam en de naam voor de boodschap
    return false;
    if (!validRequired(theForm.email,"e-mail adres"))
    return false;
    if (!validRequired(theForm.bericht,"bericht"))
    return false;
    return true;
    }
    </script>[/code:1:4d01a18abb]

    En dit is het formulier:

    [code:1:4d01a18abb]<form action="formulier_verwerk.php" method="post" onsubmit="return validateForm(this)" id="formulier">
    <p>
    Uw naam:<br />
    <input type="text" name="naam" id="naam" />
    </p>
    <p>
    Uw e-mail adres:<br />
    <input type="text" name="email" id="email" />
    </p>
    <p>
    Uw bericht:<br />
    <textarea rows="6" cols="45" name="bericht" id="bericht"></textarea>
    </p>
    <p>
    <input type="submit" name="verzenden" value="verzenden" />
    </p>
    </form>[/code:1:4d01a18abb]

    Bijdrager
    Robsappeltjes
    ”Robbes”

    Nee, ik bedoel niet de afhandeling! dat kan ik doen met een standaard CGI – script van het hostingbedrijf.

    Mocht je dit nu niet hebben, of je zou er extra voor moeten betalen dan kun je het e.a. ook laten door-routeren bij Cut and Paste Scrips

    Het is gratis! Wanneer je dus (standaard) geen gebruik maakt van de scripting mogelijkheid dan kun je dit overwegen, je hoeft dan je abonnement niet te upgraden.

    :apple: Robsappeltjes :apple:

    Bijdrager
    chilli dude

    oe dat is een goede tip:)

    sorry dat ik in dit draadje verder ga, maar is misschien wel zo handig. Want als je de submit button klikt dat zegtie dat je nog paar velden moet invullen…okay die vul je dan in…maar als dan submit wordt geklikt en alles is ingevuld hoe kan je hem dan naar andere pagina laten verspringen die bijvoorbeeld zegt Bedankt voor het invullen ofzo…

    Bijdrager
    Macinspire

    dat laten weergeven door de pagina waarin het verwerkt wordt misschien?
    dus de pagina die in de post=”” staat?

    Bijdrager
    chilli dude

    post “mijnpagina.html” dus?

    Bijdrager
    basvandorst
    ”chilli

    post “mijnpagina.html” dus?

    Nee, form action=”hierhetverwerkscript.php/asp/pl” ….
    Heb je het script dat je data verwerkt zelf gemaakt of is het zo’n standaard geval van je provider ?
    Als script zelf is gemaakt gooi je er iets in zoals:
    [code:1:461bb9e229]
    <meta http-equiv="refresh" content="1;url=bedankt.html">
    [/code:1:461bb9e229]

    Is het een script dat je provider aanlevert dan moet je waarschijnlijk een hidden value mee geven in je formulier:
    [code:1:461bb9e229]
    <input type="hidden" name="next_page" value="bedankt.html">
    [/code:1:461bb9e229]
    dat next_page is een voorbeeld, je zou even aan je provider moeten vragen (of ergens bij help kijken), welke naam je dat moet meegeven

    Bijdrager
    chilli dude

    okidokie:) dankjewel

    Bijdrager
    thomasthomas

    wil je ook dat de inhoud van zo’n field gechecked wordt? Want dan moet je even met reguliere expressies aan de slag in javascript of php.. altyd leuk:)

    Bijdrager
    X-Naut

    Kijk ook eens naar Formmail; makkelijk aan te passen (bv. welke pagina je krijgt bij succes en welke pagina bij error)

    Bijdrager
    Harryk

    Nee, ik bedoel niet de afhandeling! dat kan ik doen met een standaard CGI – script van het hostingbedrijf.

    Meestal zijn die standaard CGI-scripts gewoon Formmail van Matt Wright, de meest gebruikte cgi form-handler geschreven in perl. Grote kans dat die het is.
    Formmail heeft beide functies die je noemt ingebouwd, kan 1) verwijzen naar een thank-you pagina, en valideert velden op aanwezigheid van inhoud, en valideert nog eens het email-veld op syntax. Dit alles naar keuze.

    Er zijn 2 manieren waarop die validatie kan plaatsvinden, zoals net genoemd server-side, want dat perl-script doet dat dan op de server na submit van het formulier, maar het kan ook client-side gebeuren. Dat is wat sneller, en netter. Dan gebeurt de validatie met javascript in de browser zelf. Er zijn honderden scripts te vinden op internet als je zoekt op ‘javascript field validation’. Het leukste is echter om e.e.a zelf in javascript aan te passen. Ik zeg altijd maar, als ik het heb kunnen leren kan iedereen het leren.. WEL dan Netscape installeren want die heeft een hele goeie javascript debugger en dat is zeker in de beginfase geen overbodige luxe.

    Bijdrager
    kluivers
    ”Jordgubb”

    Ik gebruik zelf een validatie routine die ik ‘geleend’ heb van David Fells.

    Zie: http://www.devarticles.com/c/a/HTML/DHTML-Form-Enhancement/

    Goede tip. Ik heb hem hier en daar wat aangepast zodat ik alle fouten netjes afgewikkeld krijg in 1 alert. Alleen de case “equals” levert bij mij een probleem op.

    case ‘equals’ :
    attrEq = form.getAttribute(“equals”);
    var objEq = document.getElementById(attrEq);
    if(objEq){
    if (form.value != attrEq.value) {
    attrErrorMsg3 = “De invoer bij veld ” + objEq.screenname + ” is niet gelijk aan de invoer bij het veld ” + form.screenname + “.n”;
    error = true;
    if(attrFormFocus == “”){
    attrFormFocus = form;
    }
    }
    }
    break;

    // de document.getElementById(attrEq); loopt bij mij in de soep. de attrEq wordt netjes gevuld met nww .Ik heb in de body hetvolgende staan.

    <td width=”260″><input type=”password” name=”nww” value=”<?php if(!empty($_POST[‘nww’])) {echo $_POST[‘nww’];} ?>” size=”24″ maxlength=”255″ tabindex=”15″ validate=”regex” regex=”name” req=”n” screenname=”uw nieuwe wachtwoord”></td>
    <td width=”256″><input type=”password” name=”hnww” value=”<?php if(!empty($_POST[‘hnww’])) {echo $_POST[‘hnww’];} ?>” size=”24″ maxlength=”255″ tabindex=”16″ validate=”equals” equals=”nww” req=”n” screenname=”herhaling nieuw wachtwoord”></td>

    iemand een idee ? Ik zie het niet meer.
    tnx !

    Bijdrager
    mac748

    de functie heet getElementById() dus dan moet er wel een Id zijn!

    Bijdrager
    kluivers

    attrEq = form.getAttribute(“equals”);
    equals=”nww”
    var objEq = document.getElementById(attrEq);
    name=”nww”

    dus : ik zou zeggen, id is “document.nww”

    of moet het document.form.nww zijn ?

    Bijdrager
    mac748

    in de input tag bedoel ik:
    [code:1:76dceb60cd]<input type="password" name="nww" value="<?php if(!empty($_POST[’nww’])) {echo $_POST[’nww’];} ?>" size="24" maxlength="255" tabindex="15" validate="regex" regex="name" req="n" screenname="uw nieuwe wachtwoord">[/code:1:76dceb60cd]
    er staat al veel in maar geen id

    Bijdrager
    kluivers
    ”mac748″

    in de input tag bedoel ik:
    [code:1:9bdb153dde]<input type="password" name="nww" value="<?php if(!empty($_POST[’nww’])) {echo $_POST[’nww’];} ?>" size="24" maxlength="255" tabindex="15" validate="regex" regex="name" req="n" screenname="uw nieuwe wachtwoord">[/code:1:9bdb153dde]
    er staat al veel in maar geen id

    en inderdaad, zet er id=”nww” in en het werkt. Sjonge, kan het leven soms simpel zijn zeg.

    bij deze, mijn meer dan hartelijke dank ! :D

    edit: dit werkt ook, handig: weer een tag minder: document.getElementByName(attrEq)

    Bijdrager
    mac748

    Ja, zo gemakkelijk is het niet, getElementsByName() word alleen door Mozilla en Safari goed ondersteund. In IE worden ook elementen zonder name attribute, maar waar wel een id met de naam aanwezig is, geselecteerd.

    Bijdrager
    kluivers

    Ok. Duidelijk. Dus zorgen dat id en name met gelijke waarde niet samen voorkomen is dan het devies? of gewoon id gebruiken en dus een extra attri toevoegen ?

    ps, weet je nog een goede link voor een beetje een up to date “gids” van deze js functies ? Zou wel aardig helpen.

    Bijdrager
    mac748

    http://www.quircksmode.org
    en dan W3C DOM > Tests > compatability-*

    Bijdrager
    WebJ

    @mac748: Quirksmode.org (eventjes goed linken :innocent: – die c hoort niet in de naam)

    Bijdrager
    kluivers

    Mijn dank mac748 (&Webj). Dit is wel even weer genoeg informatie voor de komende dag(en). :mrgreen:

27 berichten aan het bekijken - 1 tot 27 (van in totaal 27)

Je moet ingelogd zijn om een reactie op dit onderwerp te kunnen geven.