Jquery charger formulaire sans recharger
Résolu
matiou34
Messages postés
198
Date d'inscription
Statut
Membre
Dernière intervention
-
manguo -
manguo -
Bonjour,
Je cherche à afficher les informations qui retourne d'un formulaire sur la même page (dans un div) et surtout sans recharger la page (avec un petit "loading):
Ma page index.php:
et mon fichier load.php
Bien entendu, le $_post ne récupère pas la valeur des textarea. L'animation et la page load.php se charge bien mais sans les valeurs.
Je pense que je fais une erreur d'incompréhension.
Quelqu'un peut-il m'éclairer ?
Merci bien !
Je cherche à afficher les informations qui retourne d'un formulaire sur la même page (dans un div) et surtout sans recharger la page (avec un petit "loading):
Ma page index.php:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('#button').submit(function() { $('#load').show(); $('#result').load('load.php', function() { $('#load').hide(); }); return false; }); }); </script> </head> <div id="result"></div> <form id="button" action="load.php" method="post"> <textarea id="title" name="title" type="text"></textarea> <textarea id="description" name="description" type="text"></textarea> <input type="submit" value="Go!" /> </form> <div id="load" style="display: none;"> <img src="http://www.almajidcenter.org/images/gallery_loader.gif" /> </div>
et mon fichier load.php
<?php $prenom = $_POST['title']; $nom = $_POST['description']; print("<center>Bonjour $prenom $nom</center>"); ?>
Bien entendu, le $_post ne récupère pas la valeur des textarea. L'animation et la page load.php se charge bien mais sans les valeurs.
Je pense que je fais une erreur d'incompréhension.
Quelqu'un peut-il m'éclairer ?
Merci bien !
A voir également:
- Formulaire ajax sans rechargement
- Whatsapp formulaire opposition - Guide
- Formulaire de réclamation facebook - Guide
- Formulaire de reclamation instagram - Guide
- Confirmer le nouvel envoi du formulaire err_cache_miss ✓ - Forum Access
- Formulaire de contact le bon coin introuvable ✓ - Forum Réseaux sociaux
4 réponses
<!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> <script src="http://malsup.github.io/jquery.form.js"></script> <script> // prepare Options Object var options = { target: '#update', url: 'load.php', beforeSubmit : function(){ $('#load').show(); }, success: function() { $('#load').hide(); alert('Thanks for your comment!'); } }; // pass options to ajaxForm $('#myForm').ajaxForm(options); </script> </head> <body> <div id="update"></div> <form id="myForm" action="load.php" method="post"> Name: <input type="text" name="title" /> Comment: <textarea name="description"></textarea> <input type="submit" value="Submit Comment" /> </form> </body> </html>
manguo
salut, tu pourrais me passer le code de ton load.php stp
Salut,
Tu n' a pas mis d'ID à ton bouton...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('#button').click(function() { // click et pas submit $('#load').show(); $('#result').load('load.php', function() { $('#load').hide(); }); return false; }); }); </script>
Tu n' a pas mis d'ID à ton bouton...
<input type="submit" id="button" value="Go!" />
Merci Melooo mais ça ne marche pas.
En fait, ça retourne bien le "bonjour" mais pas les valeurs des textarea. La page load.php se charge donc. Mais sans les données générées par les textarea
D'autres options ?
Merci !
PS: ça marche si je ne passe pas par jquery (simple $_post). Hors ce que je souhaite c'est afficher les valeurs des textarea dynamiquement sans recharger la page. C'est pour ça que j'utilise jquery
En fait, ça retourne bien le "bonjour" mais pas les valeurs des textarea. La page load.php se charge donc. Mais sans les données générées par les textarea
D'autres options ?
Merci !
PS: ça marche si je ne passe pas par jquery (simple $_post). Hors ce que je souhaite c'est afficher les valeurs des textarea dynamiquement sans recharger la page. C'est pour ça que j'utilise jquery
A aucun moment les données du formulaire sont envoyées, load.php reçoit un $_POST vide.
Je te suggère d'utiliser jQuery Form plugin et la méthode ajaxSubmit ou ajaxForm
http://jquery.malsup.com/form/#api
// prepare Options Object
var options = {
target: '#divToUpdate',
url: 'comment.php',
beforeSubmit : function(){
$('#load').show();
},
success: function() {
$('#load').hide();
alert('Thanks for your comment!');
}
};
// pass options to ajaxForm
$('#myForm').ajaxForm(options);
Je te suggère d'utiliser jQuery Form plugin et la méthode ajaxSubmit ou ajaxForm
http://jquery.malsup.com/form/#api
// prepare Options Object
var options = {
target: '#divToUpdate',
url: 'comment.php',
beforeSubmit : function(){
$('#load').show();
},
success: function() {
$('#load').hide();
alert('Thanks for your comment!');
}
};
// pass options to ajaxForm
$('#myForm').ajaxForm(options);