javascript resetknop

[Verwijderd]

Ik probeer een resetknop te maken dmv javascript. Ik kan niet de gewone html resetknop gebruiken. Hier is de code die ik tot nu toe heb:

code:

<input type="text" name="leerlingnr" size="30" value="<? echo $leerlingnr;?>">
<input type="text" name="voornaam" size="30" value="<? echo $voornaam;?>">
<input type="button" value="Reset" style="width: 90" onclick="javascript:resetFields()">

<script language="JavaScript">
function resetFields() {
form.leerlingnr.value = "";
form.voornaam.value = "";
}</script>

Een groot deel vd opmaakcode en form heb ik weggelaten! Om de een of andere reden doet hij alles behalven resetten. Heeft er iemand een idee waarom niet?

[ Voor 20% gewijzigd door Verwijderd op 30-01-2005 01:28 ]

[Alex)]

Je hebt een paar foutjes gemaakt:
- Je geeft geen form-tag mee (<FORM name="" action="" method="">)
- Het is [code] en [/code], i.p.v. <code> en </code>
- Een javascript voor zoiets bestaat uit:

JavaScript:

document.formuliernaam.elementnaam.value= "";

of

JavaScript:

document.forms.formuliernaam.elementnaam.value= "";

- Je geeft die knop een breedte van 90. 90 wat? 90 fietsbellen? 90 auto's? 90 lagen verf? ik denk 90px
- Bij een onclick hoef je alleen een functie op te geven, javascript: hoeft er niet voor.

[ Voor 32% gewijzigd door Alex) op 30-01-2005 01:29 ]

[Verwijderd]

Dit is de formname die bij het formulier hoort:

<form action="index.php" method="post">

[Alex)]

Kijk eens naar mijn tips hierboven, moet je op weg helpen... (vergelijk tip #1 maar met jouw code)

[Verwijderd]

code:

<form name="aanmeldform" action="index.php" method="post">
<script language="JavaScript">
function resetFields() {
aanmeldform.leerlingnr.value = "";
aanmeldform.voornaam.value = "";
}</script>

Ik ben er uit :d. Dank U wel voor de tip.

document.formuliernaam.elementnaam.value= "";

Waar staat document voor? Wat zou ik daar dan nog moeten invullen? Waarom zou ik het invullen als hij het nu ook doet (puur interesse)

Deus

[Alex)]

Het is vooral voor de netheid, en iets meer browsercompatabiliteit.
document geeft aan binnen welk object je het zoekt.
Grafisch:

code:

Document
  \
   Formulier
    \
      Element
       \
         Eigenschap

Met het script ga je eerst helemaal naar boven, om daarna dieper in de tree te duiken.
(Toch, crisp?)

[glashio]

Je kan ook <INPUT type="reset"> gebruiken als het alleen om deze 2 text velden gaat die gereset moeten worden

[ Voor 19% gewijzigd door glashio op 30-01-2005 01:47 ]

[Joen]

Je kunt ook gewoon een directe resetfunctie gebruiken net zoals het klikken op een reset-knop:

code:

<form name="mijnformulier">
<input type="text" name="leerlingnr" size="30" value="<? echo $leerlingnr;?>">
<input type="text" name="voornaam" size="30" value="<? echo $voornaam;?>">
<input type="button" value="Reset" style="width: 90" onclick="document.mijnformulier.reset()">
</form>

Owja, maar jij zal de velden wel leeg willen hebben zeker? :PDan meot je er gewoon voorzorgen dat die velden geen voorgedefiniëerde waardes bevat.

Met "document" verwijs je altijd naar de huidig geladen pagina. Is niet altijd per se nodig, kom je eigen overzichtelijkheid iig meestal wel ten goede.

[Alex)]

Hij wil alleen enkele velden resetten, niet allemaal. Dan is een RESET-knop onhandig.

[b19a]

Verwijderd schreef op zondag 30 januari 2005 @ 01:37:

code:

<form name="aanmeldform" action="index.php" method="post">
<script language="JavaScript">
function resetFields() {
aanmeldform.leerlingnr.value = "";
aanmeldform.voornaam.value = "";
}</script>

Ik ben er uit :d. Dank U wel voor de tip.

document.formuliernaam.elementnaam.value= "";

Waar staat document voor? Wat zou ik daar dan nog moeten invullen? Waarom zou ik het invullen als hij het nu ook doet (puur interesse)

Deus

99,5% kans dat je momenteel test met Internet Explorer, dat is de 4e fout die je maakt in dit topic . IE pakt alle "foute" code en verzint er iets leuks bij. Je roept iets aan binnen het document, dus je begint met document.

zo ook: document.getElementById, document.getElementsByTagName... het zit allemaal verwerkt in het document-object. Helaas hebben de programmeurs van Redmont zich niet aan de regels gehouden en zo een hoop foute javascript de wereld in geholpen.

[Verwijderd]

99,5% kans dat je momenteel test met Internet Explorer, dat is de 4e fout die je maakt in dit topic . IE pakt alle "foute" code en verzint er iets leuks bij. Je roept iets aan binnen het document, dus je begint met document.

Ik val in de 0,5% . Ik ben firefox gebruiker . In beide gaat het goed. Ik zal nog even wat meer uitleg geven over de functie v die resetknop. Ik ben bezig aan een site waar mensen hun persoonlijke gegevens in een formulier moeten invullen: naam, leerlingnummer, emailadres enz. Dit is een aanmeldsite voor een grote LAN party die ik organiseer. De resetknop is dus om al die velden leeg te maken. Het probleem is dat de gewone html resetknop (<input type="reset">...) de invoerwaardes niet weghaalt, maar terugzet naar hun oorspronkelijke waarde. Als hij oorspronkelijk leeg was en er wordt dan op de resetknop geklikt, dan gaat het goed. Stel: De gebruiker voert al zijn gegevens, behalve het verplichte mailadresveld in en drukt op verzenden. De site geeft een foutmelding en zet zijn invoerwaardes die al waren ingevuld terug in de velden. Nu werkt de reset niet meer. Kijk zelf maar eens op de site (niet letten op tekst op vreemde plekken, dit zijn gewoon tests om te kijken of de variables de goede waarde bevatten). http://81.69.15.71/aanmelden/

[b19a]

(Firefox gebruiker groet u ). Naar mijn idee werkt een reset-button juist zo dat het de waarden re-set, dus herstelt, en wat jij maakt is meer iets van een annuleren-button! Je zou eventueel eerst waarden client-side kunnen controleren, met javascript, om zo het hele probleem ook te verhelpen.

offtopic:
wist niet dat firefox zulke code ook slikte

[crisp]

Je krijgt anders wel leuke warnings:

Warning: Element referenced by ID/NAME in the global scope. Use W3C standard document.getElementById() instead.
Source File: file:///g:/bla.html
Line: 11

Anyway, een name/id op je form is niet nodig aangezien je gewoon een handle naar je form vanuit je eventhandler kan meegeven:

HTML:

<input type="button" value="Reset" style="width:90px" onclick="resetFields(this.form)">

JavaScript:

function resetFields(form)
{
    form.elements['leerlingnr'].value = '';
    form.elements['voornaame'].value = '';
}

[crisp]

oh, en dit hoort dus in Webdesign & Graphics