Comment puis-je réinitialiser un formulaire en ajax de rappel?

Je suis l'envoi d'un formulaire à l'aide d'ajax simple et renvoyer les résultats dans un div au-dessus du formulaire. Le problème est qu'une fois que le formulaire est soumis et validé, j'affiche un grand merci et souhaitez réinitialiser le formulaire de manière à ne pas appuyez simplement sur le bouton soumettre de nouveau... n'arrive pas à trouver le bon code pour ce faire...

<form id="myForm" target="sendemail.php" method="post">
<div id="results"></div>
<input type="text" name="value1">
<input type="text" name="value2">
<input type="submit" name="submit">
</form>

Donc, ma sendemail.php les erreurs de validation et de succès messages apparaissent dans les #résultats sans problèmes.

Mais... quand j'essaie d'envoyer un javascript formulaire de commande de réinitialisation, il ne fonctionne pas. Naturellement, je ne le vois pas dans le code source, c'est un AJAX rappel donc je ne sais pas si c'est la question ou si je suis juste en utilisant la mauvaise syntaxe.

echo "<p>Thank you. Your message has been accepted for delivery.</p>";
echo "<script type=\"text/javascript\">setTimeout('document.getElementById('myForm').reset();',1000);</script>";

Toutes les idées gourous?

Êtes-vous à l'aide de jQuery?

OriginalL'auteur B.Gordon | 2010-03-22

Avez-vous essayé

<script type="text/javascript">
    $.ajax.....
     success: function() {
          $("#MyForm input").val('');
     }
</script>

OriginalL'auteur bksi

`First of all`

changement

<form id="myForm" target="sendemail.php" method="post">

<form id="myForm" onsubmit="return doSend();">

Pur javascript, vous pouvez:

mettre un vide script balise HTML:

<script type="text/javascript" id="request"></script>

en javascript n':

function $(_){
    return document.getElementById(_);
}
function renderMessage(msg){
    $("results").innerHTML = msg;
}
function resetForm(){
    $("myForm").reset();
}
function doSend(){
    //only for **GET** request
    $("request").src = "sendemail.php?value1=xx&value2==yy";
    return false;
}

en PHP retourne:

renderMessage("<p>Thank you.</p>");resetForm();

il sera la cause d'un javascript de rappel à partir de php.

Avec jQuery

seulement ajouter de la

function doSend(){
    $("#results").load("sendemail.php",{value1:"xx",value2:"yy"},function(){
        //callback here
        $("#myForm").reset();
    })
}

Sais, ça fait un moment depuis cette réponse, mais jQuery option doit être $('#myform')[0].reset();

OriginalL'auteur tym1193

1

La plupart des formes de nos jours surmonter le problème de certains utilisateurs en double-cliquant sur les boutons en faisant un setAttribute('disabled', 'disabled') sur le bouton soumettre. Vous voudrez peut-être faire un double whammy de cacher le formulaire complètement, et de mettre un bouton à sa place pour afficher le formulaire.

Je suis en train de faire la validation dans le php qui envoie l'e-mail... comment pourrais-je définir cet attribut dans le succès de données que j'ai envoyer à la div?

OriginalL'auteur amphetamachine
0

Dans le fichier php qui génère les résultats, coller une
```
echo '<p>Thank you. Your message has been accepted for delivery.</p>';
```
- Y et dites-le javascript pour le retour. Simple. Il rend également plus facile parce que si une erreur se produit, il suffit de changer le texte de sortie sans avoir à changer quoi que ce soit sur le côté client.

OriginalL'auteur Harley Watson
0

Personnellement, je le faire avec Jquery, en définissant les formulaires champs de vide une fois la soumission ajax retourne. Je pense que vous trouverez beaucoup de ressources sur StackOverflow ou ailleurs, si vous décidez d'aller dans cette voie.

OriginalL'auteur Tom
0

La suivante devrait fonctionner:
```
<script type="text/javascript">
  function resetForm() {
    document.getElementById("myForm").reset();
  }
</script>
```
Pour une raison étrange... ce n'est pas rien... pas d'erreurs...juste ne pas faire n'importe quoi.
Avez-vous l'appel de la fonction? Vous pouvez ajouter un bouton de test comme suit: <input type="button" value="réinitialiser" onclick="resetForm()">
Désolé, je pense que j'ai mal lu votre question initiale. Je ne pense pas que vous devez utiliser setTimeout. Si vous appelez la réinitialisation directement, il doit travailler: echo "<script type=\"text/javascript\">document.getElementById('myForm').reset();</script>";
J'ai ajouté cet écho aux données qui est placé dans le div en cas de succès... Il ne fait rien (et je ne vois pas la source car il est injecté via ajax). Mais, la méthode bouton appelle le script et efface la forme donc je sais que la fonction fonctionne... il semble que l'appel peut ne pas être en train de faire quelque chose... peut-être hors de portée, car il va dans une fois que la page est déjà rendu?

OriginalL'auteur Templar
0

vous aurez besoin de la fonction eval() de l'ajax résultat une fois terminé. si vous utilisez quelque chose comme jquery, cela peut être fait très facilement.

pouvez-vous me donner un exemple de cas où et comment je pourrais le faire avec le code dans le problème ici? Merci pour l'entrée.
$.ajax({ url: 'ajax/test.php', success: function(result) { eval(result); } }); vous pouvez générer du code javascript à l'intérieur test.php par exemple: alert("ceci est un test");

OriginalL'auteur Fixtree

Réel simple mais peut-être pas la meilleure façon de le faire est après qu'il valdidates faire un

header("Location: url?accepted=true")

et puis mettre

if($_REQUEST['accepted'] == "true") echo "<p>Thank you. Your message has been accepted for delivery.</p>";

OriginalL'auteur user299416

<script type="text/javascript">
    $.ajax.....
     success: function() {
         $("#myForm")[0].reset();
     }
</script>

le code ci-dessus permet de réinitialiser le formulaire en entier

OriginalL'auteur Austin Rodrigues

Vous devez vous connecter pour publier un commentaire.