Effacer les champs de formulaire avec jQuery

Question

Je veux effacer tous les champs de saisie et de zone de texte d'un formulaire. Cela fonctionne comme suit lorsqu'on utilise un bouton de saisie avec l'option reset classe :

$(".reset").bind("click", function() {
  $("input[type=text], textarea").val("");
});

Cela effacera tous les champs de la page, et pas seulement ceux du formulaire. À quoi ressemblerait mon sélecteur pour le seul formulaire dans lequel se trouve le bouton de réinitialisation ?

Answer 1

Pour jQuery 1.6 et plus :

$(':input','#myform')
  .not(':button, :submit, :reset, :hidden')
  .val('')
  .prop('checked', false)
  .prop('selected', false);

Pour jQuery < 1.6 :

$(':input','#myform')
  .not(':button, :submit, :reset, :hidden')
  .val('')
  .removeAttr('checked')
  .removeAttr('selected');

Veuillez consulter cet article : Réinitialisation d'un formulaire à plusieurs étapes avec jQuery

Ou

$('#myform')[0].reset();

Comme jQuery suggère :

Pour récupérer et modifier les propriétés du DOM, telles que l'adresse de l'utilisateur. checked , selected o disabled des éléments de formulaire, utilisez l'option .prop() método.

Answer 2

$(".reset").click(function() {
    $(this).closest('form').find("input[type=text], textarea").val("");
});

Answer 3

Y a-t-il une raison de ne pas l'utiliser ?

$("#form").trigger('reset');

Answer 4

Cela ne permet pas de gérer les cas où les champs de saisie du formulaire ont des valeurs par défaut non vides.

Quelque chose comme ça devrait marcher

$('yourdiv').find('form')[0].reset();

Answer 5

Si vous utilisez des sélecteurs et que vous transformez les valeurs en valeurs vides, cela ne réinitialise pas le formulaire, cela rend tous les champs vides. La réinitialisation consiste à rendre le formulaire tel qu'il était avant toute action d'édition de la part de l'utilisateur après le chargement du formulaire du côté serveur. S'il y a une entrée avec le nom "nom d'utilisateur" et que ce nom d'utilisateur a été pré-rempli depuis le côté serveur, la plupart des solutions sur cette page supprimeront cette valeur de l'entrée, et ne la réinitialiseront pas à la valeur telle qu'elle était avant les changements de l'utilisateur. Si vous avez besoin de réinitialiser le formulaire, utilisez ceci :

$('#myform')[0].reset();

si vous n'avez pas besoin de réinitialiser le formulaire, mais de remplir toutes les entrées avec une certaine valeur, par exemple une valeur vide, alors vous pouvez utiliser la plupart des solutions des autres commentaires.