Champs en forme claire avec jQuery

pour jQuery 1.6+ :

$(':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');

s'il vous Plaît voir ce post: réinitialisation d'une forme multi-étapes avec jQuery

ou

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

comme jQuery suggère :

pour récupérer et changer les propriétés DOM telles que la checked , selected , ou disabled état des éléments de forme, utiliser le .prop() la méthode.

y a-t-il une raison pour que cela ne soit pas utilisé?

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

cela ne traitera pas les cas où les champs d'entrée de formulaire ont des valeurs par défaut non vides.

quelque chose comme devrait fonctionner

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

si vous utilisez des sélecteurs et faites des valeurs à des valeurs vides, ce n'est pas réinitialiser le formulaire, c'est rendre tous les champs vides. Réinitialiser est de faire le formulaire comme il était avant toute action d'édition de l'utilisateur après la charge de formulaire du côté du serveur. S'il y a une entrée avec le nom "username" et que le nom d'Utilisateur a été pré-rempli du côté du serveur, la plupart des solutions sur cette page supprimera cette valeur de l'Entrée, pas la Réinitialiser à la valeur qu'elle était avant les changements de l'utilisateur. Si vous devez réinitialiser le formulaire, utilisez ce:

$('#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 à partir d'autres commentaires.

Simple mais qui fonctionne comme un charme.

$("#form").trigger('reset'); //jquery
document.getElementById("myform").reset(); //native JS

si quelqu'un est encore en train de lire ce fil, voici la solution la plus simple en utilisant non pas jQuery, mais simplement JavaScript. Si vos champs d'entrée sont dans un formulaire, il y a une simple commande de réinitialisation JavaScript:

document.getElementById("myform").reset();

pour en savoir plus, cliquez ici: http://www.w3schools.com/jsref/met_form_reset.asp

santé!

$('form[name="myform"]')[0].reset();

pourquoi doit-on utiliser du JavaScript?

<form>
    <!-- snip -->
    <input type="reset" value="Reset"/>
</form>

http://www.w3.org/TR/html5/the-input-element.html#attr-input-type-keywords

essayé que l'un d'abord, il ne sera pas effacer les champs avec des valeurs par défaut.

Voici une façon de le faire avec jQuery, puis:

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

j'ai le truc le plus facile pour réinitialiser le formulaire

jQuery("#review-form")[0].reset();

ou

$("#review-form").get().reset();

si vous voulez vider toutes les boîtes de saisie quel que soit leur type, c'est un pas de minute de

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

avec Javascript, vous pouvez simplement le faire avec cette syntaxe getElementById("your-form-id").reset();

vous pouvez également utiliser jquery en appelant la fonction reset de cette façon $('#your-form-id')[0].reset();

N'oubliez pas [0] . Vous obtiendrez l'erreur suivante si

TypeError: $(...).la réinitialisation n'est pas une fonction

JQuery fournit également un événement que vous pouvez utiliser""

$('#form_id').déclencheur("reset");

j'ai essayé et ça fonctionne.

Note: il est important de noter que ces méthodes ne réinitialisent votre formulaire qu'à leur valeur initiale définie par le serveur lors du chargement de la page. Cela signifie que si votre entrée a été définie sur la valeur 'set value' avant que vous ne fassiez un changement aléatoire, le champ sera réinitialisé à cette même valeur après que la méthode reset soit appelée.

j'Espère que ça aide

$('#editPOIForm').each(function(){ 
    this.reset();
});

où editPOIForm est l'attribut id de votre formulaire.

pourquoi tu n'utilises pas document.getElementById("myId").reset(); ? c'est le simple et joli

code testé et vérifié:

  $( document ).ready(function() {
    $('#messageForm').submit(function(e){
       e.preventDefault();
    });
    $('#send').click(function(e){
      $("#messageForm")[0].reset();
    });
  });

Javascript doit être inclus dans $(document).ready et il doit être avec votre logique.

j'utilise ceci:

$(".reset").click(function() {
  $('input[type=text]').each(function(){
     $(this).val('');
  });
});

et voici mon bouton:

<a href="#" class="reset">
  <i class="fa fa-close"></i>
     Reset
</a>

disons que si vous voulez effacer les champs et sauf accountType,dans la zone mean time dropdown seront réinitialisés à une valeur particulière,I. c'est tout.Les champs restants doivent être réinitialisés pour vider I. e zone de texte.Cette approche sera utilisée pour effacer des champs particuliers comme notre exigence.

 $(':input').not('#accountType').each( function() {

    if(this.type=='text' || this.type=='textarea'){
             this.value = '';
       }
    else if(this.type=='radio' || this.type=='checkbox'){
         this.checked=false;
      }
         else if(this.type=='select-one' || this.type=='select-multiple'){
              this.value ='All';
     }
 });

la solution la plus simple et la meilleure est-

$("#form")[0].reset();

ne pas utiliser ici -

$(this)[0].reset();

utilisez ce Code pour appeler la fonction de réinitialisation normale par jQuery

setTimeout("reset_form()",2000);

et écrire cette fonction sur le Site jQuery sur Document Ready

<script>
function reset_form()
{
    var fm=document.getElementById('form1');
    fm.reset();
}
</script>

@using (Ajax.BeginForm("Create", "AcceptanceQualityDefect", new AjaxOptions()
{
    OnSuccess = "ClearInput",
    HttpMethod = "Post",
    UpdateTargetId = "defect-list",
    InsertionMode = InsertionMode.Replace
}, new { @id = "frmID" })) 

1. frmID est l'identification du formulaire

2. OnSuccess de l'opération nous appelons la fonction JavaScript avec le nom " ClearInput "

   <script type="text/javascript">
       function ClearInput() {
           //call action for render create view
           $("#frmID").get(0).reset();
       }
   </script>
   

3. si vous faites les deux à droite, alors vous ne pourrez pas l'empêcher de fonctionner...

si je veux effacer tous les champs sauf accountType..Utilisez le

$q(':input','#myform').not('#accountType').val('').removeAttr('checked').removeAttr('selected');

le code que je vois ici et sur des questions connexes semble incomplet.

Réinitialiser une forme signifie définir les valeurs originales du HTML, donc j'ai mis cela ensemble pour un petit projet que je faisais basé sur le code ci-dessus:

            $(':input', this)
                .not(':button, :submit, :reset, :hidden')
                .each(function(i,e) {
                    $(e).val($(e).attr('value') || '')
                        .prop('checked',  false)
                        .prop('selected', false)
                })

            $('option[selected]', this).prop('selected', true)
            $('input[checked]',   this).prop('checked',  true)
            $('textarea',         this).each(function(i,e) { $(e).val($(e).html()) })

faites-moi savoir si je manque quelque chose ou quelque chose peut être amélioré.

aucun des éléments ci-dessus ne fonctionne sur un cas simple lorsque la page inclut un appel au contrôle de l'utilisateur web qui implique le traitement des requêtes IHttpHandler (captcha). Après avoir envoyé le requsrt (pour le traitement d'image), le code ci-dessous n'efface pas les champs du formulaire (avant d'envoyer la requête HttpHandler). tout fonctionne correctement.

<input type="reset"  value="ClearAllFields" onclick="ClearContact()" />

 <script type="text/javascript">
       function ClearContact() {
           ("form :text").val("");
       }
    </script>

j'ai écrit un plugin jQuery universel:

/**
 * Resets any input field or form
 */
$.fn.uReset = function () {
    return this.filter('form, :input').each(function () {
        var input = $(this);
        
        // Reset the form.
        if (input.is('form')) {
            input[0].reset();
            return;
        }

        // Reset any form field.
        if (input.is(':radio, :checkbox')) {
            input.prop('checked', this.defaultChecked);
        } else if (input.is('select')) {
            input.find('option').each(function () {
                $(this).prop('selected', this.defaultSelected);
            });
        } else if (this.defaultValue) {
            input.val(this.defaultValue);
        } else {
            console.log('Cannot reset to default value');
        }
    });
};

$(function () {
    // Test jQuery plugin.
    $('button').click(function (e) {
        e.preventDefault();
        
        var button = $(this),
            inputType = button.val(),
            form = button.closest('form');
        
        if (inputType === 'form') {
            form.uReset()
        } else {
            $('input[type=' + inputType + '], ' + inputType, form).uReset();
        }
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h3>Form</h3>
<form>
    <input type="text" value="default"/><br /><br />
    Ch 1 (default checked) <input type="checkbox" name="color" value="1" checked="checked" /><br />
    Ch 2 <input type="checkbox" name="color" value="2" /><br />
    Ch 3 (default checked) <input type="checkbox" name="color" value="3" checked="checked" /><br /><br />
    <select name="time"><br />
        <option value="15">15</option>
        <option selected="selected" value="30">30</option>
        <option value="45">45</option>
    </select><br /><br />
    R 1 <input type="radio" name="color" value="1" /><br />
    R 2 (default checked) <input type="radio" name="color" value="2" checked="checked" /><br />
    R 3 <input type="radio" name="color" value="3" /><br /><br />
    <textarea>Default text</textarea><br /><br />
    
    <p>Play with form values and then try to reset them</p>
    
    <button type="button" value="text">Reset text input</button>
    <button type="button" value="checkbox">Reset checkboxes</button>
    <button type="button" value="select">Reset select</button>
    <button type="button" value="radio">Reset radios</button>
    <button type="button" value="textarea">Reset textarea</button>
    <button type="button" value="form">Reset the Form</button>
</form>

le code suivant supprime tout le formulaire et ses champs seront vides. Si vous souhaitez effacer seulement un formulaire particulier si la page a plus d'un formulaire, s'il vous plaît mentionner l'id ou la classe du formulaire

$("body").find('form').find('input,  textarea').val('');

ajouter le bouton de réinitialisation caché comme suit

<input id="resetBtn" type="reset" value="reset" style="display:none" />
// Call reset buttons click event
// Similar to ClearInputs('resetBtn');
function ClearInputs(btnSelector) {
     var btn = $("#" + btnSelector);
     btn.click();
}

$('form').soumettre (fonction () {

var el = $(this);

$('<button type="reset" style="display:none; "></button>')
    .appendTo(el)
    .click()
    .remove()
;

return false;

});