Formulaire de réinitialisation ne fonctionne pas

J'utilise le code suivant pour réinitialiser les champs du formulaire.

document.getElementById("form1").reset();//form1 is the form id.

Il n'est pas de travail. J'ai aussi essayé avec JQuery. Même JQuery également ne fonctionne pas.

$("#reset").click(function(){
$('form1')[0].reset();
});

Mon code html est

<form name="form1" id="form1" method="post">
<h3>Personal Information</h3>
<h4>Name</h4>
<input type="text" id="fname" name="fname" maxlength=50 size=11/>
<input type="text" id="mname" name="mname" maxlength=15 size=8/>
<input type="text" id="lname" name="lname" maxlength=50 size=11/>
<input type="button" id="reset" value="Reset" onclick="Reset()"/>
</form>

Je suis W3Schools. Voici mon Violon. Pouvez-vous nous expliquer l'erreur?

Pourquoi ne pas vous utilisez un bouton de réinitialisation <input type="reset" id="reset" value="Reset">
Ne suivez pas w3schools. S'il vous plaît. Il vous enseigne terrible pratiques.
pourquoi? pouvez-vous dire
w3fools.com
Que et de changer onLoad à no wrap - in <head> (même si c'est seulement spécifique à la jsFiddle exemple).

OriginalL'auteur Lingasamy Sakthivel | 2013-11-29

15

Le problème est que vous définissez vos boutons id pour "reset". À cause de cela, vos formulaires méthode de réinitialisation ai remplacé par le bouton de l'élément. Il suffit d'utiliser un id différent pour votre bouton.
```
<form name="form1" id="form1" method="post">

<h3>Personal Information</h3> 

<h4>Name</h4>

    <input type="text" id="fname" name="fname" maxlength="50" size="11" />
    <input type="text" id="mname" name="mname" maxlength="15" size="8" />
    <input type="text" id="lname" name="lname" maxlength="50" size="11" />
    <input type="button" id="resetBtn" value="Reset" />
</form>
```
Aussi, s'il vous plaît éviter d'événements en ligne gestionnaires. Lier les événements à l'intérieur de votre script.

Voir ce violon.

+1 Cela devrait être accepté de répondre.
"Il est intéressant de noter que tous les attributs doivent être indiqués en HTML (le même nombre)" erreur: w3.org/TR/html-markup/syntax.html#syntax-attributes. Les attributs ne doivent être indiqués s'ils contiennent des caractères spécifiques (tels qu'un espace ou un > caractère). Voir le lien pour plus d'informations.
Wow je ne savais pas que. Je suppose qu'il s'applique uniquement au format XML puis. Mais encore, il ne marche pas mal si vous citez des valeurs. Édité, de toute façon.
Yep, XML et XHTML pour que ce soit), vous devez mettre les valeurs des attributs entre guillemets doubles. Mais le HTML est moins stricte markup language.
"optgroup" ne fonctionne pas avec votre code.... @sudee

OriginalL'auteur sudee
3

J'ai enfin résolu mon problème. le problème est "id=reset". Parce qu'il remplace le reset méthode . Je l'ai changé pour id="reset1". Maintenant, il est de travail

OriginalL'auteur Lingasamy Sakthivel
2

Avez-vous simplement essayer ceci : Réinitialiser
```
<input type="reset" value="Reset"/>
```
ce n'est pas une réponse à ma question. selon w3schools.com/jsref/met_form_reset.asp La méthode reset() réinitialise les valeurs de tous les éléments dans un formulaire (de même que de cliquer sur le bouton de Réinitialisation).

OriginalL'auteur Ankit Tyagi
1

Ressemble votre seleting $('form1') comme dans un élément avec un nom de balise de form1, alors je pense que vous voulez réellement pour le sélectionner par l'id:
```
$('#form1')[0].reset();
```
c'est le même que document.getElementById("form1").reset(); qui OP dit que cela ne marchait pas. Pourquoi? Je ne sais pas...
J'ai aussi essayé. C'est aussi ne fonctionne pas, viens voir mon violon
Salut, désolé j'ai raté le violon lien.
Ce n'est pas de travail.
Ok, vérifier ma nouvelle réponse stackoverflow.com/questions/20285970/...

OriginalL'auteur stilliard
1

Si votre objectif est uniquement pour réinitialiser le formulaire, vous pouvez essayer ceci:
```
<input type="reset" id="reset" value="Reset" onclick="this.form.reset();"/>
```
c'est la plus solution la plus simple

OriginalL'auteur silverbeak
1

Avec jQuery, le bon sélecteur est :
```
$('#form1') //Select with ID
```
OU
```
$('form[name=form1]') //Select with name
```
Pourquoi? Quel est le problème avec l'obtention d'une référence à l'élément via getElementById?
Non, c'est mal. les deux sont les mêmes

OriginalL'auteur Elorfin
0

J'ai mis à jour votre violon.

Pourquoi vanilla js ne fonctionne pas:

Vous n'avez pas...
```
document.getElementById("form1").reset();//form1 is the form id.
```
...au sein d'une fonction de réinitialisation. Vous pouvez faire ceci:
```
function Reset() {
    document.getElementById("form1").reset();//form1 is the form id.
}
```
Pourquoi jQuery ne fonctionne pas:

Vous n'avez pas besoin de faire tout ce que vous faites. C'est beaucoup plus simple que cela. Aussi, regardez votre 'form1' sélecteur. Vous devriez probablement ajouter '#form1 " à la place. jQuery sélectionne différentes de la fonction getElementByID. Comme vous pouvez probablement prendre par le nom, la fonction getElementByID est déjà en train de l'élément par l'ID; cependant, avec jQuery, vous devez spécifier ces choses. Aussi, n'a pas vraiment besoin de l'attribut onClick avec jquery.

Euh? Je peux voir clairement function Reset() { document.getElementById("form1").reset(); } dans son violon.
Regardez la différence entre son violon et le code posté ici. Plus précisément, OP appels reset() ici et formReset() dans la tripoter.
Parlons-nous le même violon? (jsfiddle.net/ty9rU) je ne vois pas où formReset() est appelé. Mais ce n'est pas mon point: Vous avez affirmé que la déclaration document.getElementById(...) n'était pas à l'intérieur de la Reset fonction, il est clairement.
Regardez l'attribut onClick dans le post ci-dessus, pas de la tripoter. C'est là que la confusion qui s'est passé. Le violon et le code ci-dessus ne correspondent pas.
Il a changé au cours de notre conversation.

OriginalL'auteur mborg
0

Ok, voir mon nouveau jsfiddle:
http://jsfiddle.net/ty9rU/17/
J'ai donc renommé le bouton pour reset_btn

Bref si vous aviez un élément appelé reset à l'intérieur de la forme, et qui a causé le problème.

OP déjà compris 6 min avant que vous avez posté votre réponse: stackoverflow.com/a/20286240/218196.
Je suis confus, Comment il remplace?
Parce que les fournisseurs de navigateur pensé que ce serait une bonne idée d'ajouter un formulaire de contrôle des éléments comme des propriétés d'élément de formulaire, avec leur ID nom de la propriété (s'il existait). Comme vous pouvez le voir c'est un peu confus comportement, car il va écraser les autres propriétés de l'élément de formulaire.
Ok, merci beaucoup

OriginalL'auteur stilliard

Vous devez vous connecter pour publier un commentaire.