Discussion :

[Atheus]

Bonjour,
j'ai créé un formulaire tout basique en html. Il execute un fichier resultat.php qui renvoit une requete SQL sous forme assez basique : une ligne de texte.
Je voudrais que ce texte généré apparaisse dans une DIV sur la même page que le formulaire initial.

J'ai créé ceci, mais ça ne marche pas, et je ne comprends pas l'erreur :

Mon script :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$('#form1').submit(function (e) {
    e.preventDefault();
    $.post('result.php', $('#form1').serialize(), function (data, textStatus) {
         $('#resultDIV').append(data);
    });
    return false;
});
</script>

et mon code HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<form name="form1" action="result.php" method="post" id="form1">
<input type="text" name="data1">
<input type="text" name="data2">
<input type="submit" value="OK">
</form>
 
<div id="resultDIV"></div>

Avec ceci, rien ne ne passe comme prévu, c'est à dire que mon formulaire ouvre la page result.php pour m'afficher ma requête. Ce que je ne veux pas puisque je veux rester sur ma page d'origine et afficher le résultat dans la DIV.

[Atheus]

Finalement, j'ai trouvé. Voici la modif :
(si ça peut servir à d'autres)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<script>
$(document).ready (function() {
$("form").submit(function () {
$.post("result.php",$(this).serialize(),function(texte){    
$("div#resultDIV").append(texte);  
});
return false;
}); 
}); 
</script>

[danielhagnoul]

Il execute un fichier resultat.php

Non ! "result.php"

<form name="form1" id="form1"> pas : '<form name="form1" action="result.php" method="post" id="form1">'.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
$( function(){ // forme abrégée de $(document).ready(function(){
 
    $('#form1').on( "submit", function( event ){
 
        var jqXHR = $.get( 'result.php', $('#form1').serialize() ); // ou $.post() ou $.getJSON()
 
        setTimeout( function(){
            // Si l'objet différé existe dans l'état "attendre", 
            // alors exécute la méthode fail()
 
            if ( jqXHR && jqXHR.state() === "pending" ){
                jqXHR.abort();
            }
        }, 3000 ); // 3s
 
        jqXHR.done( function( data, textStatus, jqXHR ){
            // succès de la transaction, on doit traiter le contenu de data
            console.log( data, textStatus, jqXHR );
 
 
        });
 
        jqXHR.fail( function( jqXHR, textStatus, errorThrown ){
            // échec de la transaction, gérer la catastrophe
            console.log( jqXHR, textStatus, errorThrown );
 
        });
 
        jqXHR.always( function( jqXHR, textStatus ){
            // la transaction est terminée
            // nettoyage
            // exécution d'un code dépendant
            console.log( jqXHR, textStatus );
 
        });
 
        return false;
    });
 
});