[javascript] form reset na value = postvariabele

[hanneshoffie]

Hallo,
Ik heb een formulier die de invoer velden de waarde geeft als het formulier is verzonden van wat men in heeft gevuld.
zon invoer veld:

code:

<input type="text" name="naam" value="<?php if(isset($_POST['naam'])){ echo $_POST['naam']; } ?>">

Als je dan op de reset knop drukt blijven de velden zo als ze zijn.
optie is dus javascript. Ik heb al aardig wat gegoogeld maar kom er nog niet helemaal uit.

code:

in head:
<script LANGUAGE="JavaScript">
function Reset()
{
document.form[0].naam.value = ''(2 enkele aanhalingstekens)
document.form[0].adres.value = ''
}
</script>
--- in de form

<input type="reset" value="wis formulier" onclick="Reset()">

weet iemand wat ik verkeerd doe.

alvast bedankt.

[Verwijderd]

Wat wil je precies doen? Een reset doet precies wat je mag verwachten, je krijgt die pagina voorgeschoteld zoals hij verstuurd is, zonder de wijzigingen die je op die pagina hebt gedaan. Resetten is dus niet altijd hetzelfde als een formulier leegmaken! Het is namelijk helemaal niet gegeven of een leeg formulier wel hoort te kunnen.

[ Voor 3% gewijzigd door Verwijderd op 02-12-2006 18:53 ]

[hanneshoffie]

Nee dat snap ik.
Normaal leegt de standaard reset button van de input het formulier automatisch.
Maar omdat ik er waarden aan geef aan die formulieren wil ik graag een javascript functie schrijven die als je op de reset button klikt, de waarden van de velden leeg maakt.
Volgens mij kom ik namelijk aardig in de buurt met mijn code. Gegoogeld zie je deze functies vaak terug en zouden ze moeten werken. Of zie ik iets over het hoofd?

[Verwijderd]

Nouja, ten eerste zou ik geen form[0] gebruiken, maar een referentie naar het form element geven waarin de resetknop zich bevindt. In principe kun je gewoon this.form als argument aan de functie meegeven. Verder zou ik met de elements array van dat formulier werken, om niet met naamconflicten te maken te krijgen, dus bijvoorbeeld via this.form.elements['naam'] het input element aanspreken. Verder proberen om namen als Reset te vermijden in Javascript functies en HTML attributen.

[Raynman]

En als het dus geen resetknop moet zijn, dan zou ik ook geen type="reset" te gebruiken, maar gewoon type="button".

[Verwijderd]

Dat is een goeie. En ik had ook niet gezien dat je niet false returnt naar het resetknop element. Dat zou betekenen dat je eerst het formulier leegmaakt, en alsnog reset waarna alle velden weer hun beginwaarden krijgen. Je kunt dus inderdaad beter gewoon een button gebruiken, en geen reset/submit, dan krijg je soms vervelende bijwerkingen.

[hanneshoffie]

Hallo,

ik heb nu dit in de header

code:

<Script Language = \"JavaScript\" type = \"text/javascript\" >
function Wis(form){
document.form1.naam.value = '';
document.form1.adres.value = '';
}
</script>

en verder:

code:

<form action="register.php" method="post" name="form1">
<input type="button" name="wisform" value="Wis formulier" onclick="Wis(this.form)">

en de velden naam en adres zitten ook in het formulier en zijn tekstvelden.
Het werkt nog niet. Alvast bedankt voor de hulp.

EDIT:
het werkt. Ik had een kleine fout gemaakt.
Allemaal bedankt.

[ Voor 8% gewijzigd door hanneshoffie op 02-12-2006 19:59 ]

[crisp]

Bijna helemaal goed, maar de javascript functie zou ik zo doen (je geeft niet voor niets een referentie mee):

HTML:

<script type="text/javascript">
function Wis(form)
{
  form.elements['naam'].value = '';
  form.elements['adres'].value = '';
}
</script>

verder even een subtiel schopje naar Webdesign, Markup & Clientside Scripting waar dit thuishoort

[ Voor 11% gewijzigd door crisp op 02-12-2006 20:54 ]

[XWB]

Als je veel velden hebt kan je ze ook eenvoudig doorlopen:

JavaScript:

<script type="text/javascript">
function Wis ( form )
{
  var elements = form.getElementsByTagName ( 'input' );
  
  for ( var i = 0; i < elements.length; i++ )
  {
    if ( elements[i].type.toLowerCase() == 'text' )
    {
        elements[i].value = '';
    }
  }
}
</script>

[Verwijderd]

Hacku schreef op zaterdag 02 december 2006 @ 21:09:
Als je veel velden hebt kan je ze ook eenvoudig doorlopen:

Gebruik nou gewoon form.elements