Gestion des POST [Résolu]

[Gaara-Manga]

Bonjour à tous,

J'ai fait un script qui permet de faire appelle à une page quelconque pour afficher ce qu'elle renvoie dans un div.
Ce script marche très bien.

Le voici par ailleur :

Code :

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
41
42
function aJax( pageToLoad , elementId , type) {
    var xmlhttp;
 
    if ( typeof XMLHttpRequest != 'undefined' ) {
        try {
            xmlhttp = new XMLHttpRequest();
        } catch(e) {
            xmlhttp = false;
        }
    } else {
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                xmlhttp = false;
            }
        }
    }
 
    function loadFragmentInToElement(fragment_url, element_id, type) {
        var element = document.getElementById(element_id);
        element.innerHTML = '<?php echo $Chargement; ?>';
        if(type == "POST")
        {
            xmlhttp.open("POST", fragment_url);
            http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
        }else{
            xmlhttp.open("GET", fragment_url);
        }
        xmlhttp.onreadystatechange = function() 
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
            {
                element.innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);
    }
    loadFragmentInToElement( pageToLoad, elementId, type );
}

Mon problème et que je n'arrive pas à gérer les POST avec.

Je sais vois pas pourquoi si sa vient de mon formulaire ou de mon script mais il ne se passe rien quand je clic sur mon bouton submit.

Merci beaucoup d'avance à ceux qui pourront m'aider à résoudre ce problème.

Bonne journée

[E.Bzz]

Bonjour,
il y a des paramètres dans l'url appelée ?

A+

[Gaara-Manga]

Ouaip j'avais trouvé sa bizarre d'ailleurs de passé les paramètres comme un GET (surtout trouvé sa pas pratique) mais j'avais essayé ce qui me donné à la fin quelque chose comme sa :

Code :

<form method="post" onsubmit="admin_creation.php?id={ID}&cat=document.getElementById(cat)&url=document.getElementById(url)&cat=document.getElementById(actif),'corpPage', 'POST')"">

Le {ID} renvoie juste un identifiants il marche correctement

[E.Bzz]

Envoyé par Gaara-Manga

Le {ID} renvoie juste un identifiants il marche correctement

En POST, il faut utiliser le send() pour transmettre les paramètres.

Or, tu envoies toujours null ...

EDIT : c'est quoi cette syntaxe dans le onsubmit ?

A+

[Gaara-Manga]

mdr jdébute en javascript alors niveau syntaxe c'est possible que sa ne soit pas sa^^

Pour le send, sa spasse à quel niveau en faite et sa s'utilise de quel manière ?

[E.Bzz]

Envoyé par Gaara-Manga

mdr jdébute en javascript alors niveau syntaxe c'est possible que sa ne soit pas sa^^

Code :

<input type="button" value="GO !" onclick="aJax( 'http://blabla.php' , 'elementId' , 'type');">

Mais il va falloir ajouter un paramètre pour passer les paramètres de l'url (ou les extraire du paramètre PageToLoad)....

Envoyé par Gaara-Manga

Pour le send, sa spasse à quel niveau en faite et sa s'utilise de quel manière ?

Code :

xmlhttp.send("param1="+valParam1+"&param2="+valParam2);

A+

[Gaara-Manga]

Merci pour ton aide^^

Sa ne marche pas encore par contre je sais pas pourquoi, peut être erreur dans la concaténation j'ai fait quelque chose comme sa :

Code :

1
2
    <input type="submit" name="submit" value="{FORM}" class="button" onclick="aJax('admin_creation.php?id={ID}' , 'elementId' , 'type',
    'cat='+document.getElementById('cat')+'&url='+document.getElementById('url')+'&actif='+document.getElementById('actif'));">

Et ma fonction js :

Code :

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
41
42
43
function aJax( pageToLoad , elementId , type, parametre) {
    var xmlhttp;
 
    if ( typeof XMLHttpRequest != 'undefined' ) {
        try {
            xmlhttp = new XMLHttpRequest();
        } catch(e) {
            xmlhttp = false;
        }
    } else {
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                xmlhttp = false;
            }
        }
    }
 
    function loadFragmentInToElement(fragment_url, element_id, type, parametre) {
        var element = document.getElementById(element_id);
        element.innerHTML = '<?php echo $Chargement; ?>';
        if(type == "POST")
        {
            xmlhttp.open("POST", fragment_url);
            http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
            xmlhttp.send(parametre);
        }else{
            xmlhttp.open("GET", fragment_url);
        }
        xmlhttp.onreadystatechange = function() 
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
            {
                element.innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);
    }
    loadFragmentInToElement(pageToLoad, elementId, type, parametre);
}

[E.Bzz]

Il faut un type="button" et non un type="submit"

Ajax ne tient aucun compte de la logique "formulaire" ...

Le mieux pour tes tests et de les faire sans <form> dans ta page.

A+

[E.Bzz]

... et ta chaine de paramètre, autant la construire directement dans la fonction Ajax

Code :

'cat='+document.getElementById('cat')+'&url='+document.getElementById('url')+'&actif='+document.getElementById('actif'))

A+

[Gaara-Manga]

Okey donc la j'ai changer le submit en boutton et j'ai enlevé le form.
Par contre du coup il fait plus rien lorsque je clic.

Sinon jpeux pas faire autrement que le faire passer en paramétre dans la fonction car j'ai plusieurs formulaire qui va s'en resservir alors jvais éviter de faire une fonction par formulaire^^"

[E.Bzz]

Envoyé par Gaara-Manga

Okey donc la j'ai changer le submit en boutton et j'ai enlevé le form.
Par contre du coup il fait plus rien lorsque je clic.

On peut voir le code ?

[Gaara-Manga]

Pas de soucis

Alors voici la partie html (j'utilise les templates)

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<h2>{TITLE}</h2>
<br /><br />
<p>
    <label for="cate">{CAT} :</label>
    <select name="cate" id="cat">
        <!-- BEGIN LIST_CAT -->
                <option value="{LIST_CAT.CODE}">{LIST_CAT.LIBELLE}</option>
        <!-- END LIST_CAT -->
    </select><br /><br />
</p>
<p>
    <label for="url">{URL} :</label> <input name="url" id="url" type="text" size="50" value="{URL_VALUE}" /><br /><br />
</p>
<p>
    <label for="actif">{SHOW} :</label> <input name="actif" id="actif" type="checkbox" {ACTIF}" /><br /><br />
</p>
<br />
<p align="center">
    <input type="bouton" name="submit" value="{FORM}" class="button" onclick="aJax('admin_creation.php?id={ID}' , 'elementId' , 'type',
    'cat='+document.getElementById('cat')+'&url='+document.getElementById('url')+'&actif='+document.getElementById('actif'));">
</p>

Et la fonction js qui est appelé :

Code :

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
41
42
43
function aJax( pageToLoad , elementId , type, parametre) {
    var xmlhttp;
 
    if ( typeof XMLHttpRequest != 'undefined' ) {
        try {
            xmlhttp = new XMLHttpRequest();
        } catch(e) {
            xmlhttp = false;
        }
    } else {
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                xmlhttp = false;
            }
        }
    }
 
    function loadFragmentInToElement(fragment_url, element_id, type, parametre) {
        var element = document.getElementById(element_id);
        element.innerHTML = '<?php echo $Chargement; ?>';
        if(type == "POST")
        {
            http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
            xmlhttp.open("POST", fragment_url);
            xmlhttp.send(parametre);
        }else{
            xmlhttp.open("GET", fragment_url);
        }
        xmlhttp.onreadystatechange = function() 
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
            {
                element.innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);
    }
    loadFragmentInToElement(pageToLoad, elementId, type, parametre);
}

[E.Bzz]

Il manque une " dans cette ligne

Code :

   <label for="actif">{SHOW} :</label> <input name="actif" id="actif" type="checkbox" {ACTIF}" /><br /><br />

Et les paramètres 'elementId' et 'type', il faut les remplacer par leur vraie valeur : je les avais mis comme ça pour l'exemple, ne connaissant pas leur valeur (comme pour blabla.php)

A+

[Gaara-Manga]

Oula j'ai fait n'importe quoi sur ce coup.

Donc la c'est bon il va bien jusqu'à la fonction js par contre il ne fait plus rien à partir du chargement.

Jpense que sa vient surement de cette partie :

Code :

1
2
3
4
 
http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
xmlhttp.open("POST", fragment_url);
xmlhttp.send(parametre);

[E.Bzz]

Code :

http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

C'est sûr que comme ton objet s'appelle xmlhttp, autant continuer à l'appeler comme ça

EDIT : et visiblement ton nav ne te signale pas les erreurs de script, sinon tu l'aurais vu tout de suite

A+

[Gaara-Manga]

A vi en effet ^^"
J'ai rectifié sa.

Par contre jviens de regarder ce que me renvoie parametre, et il me renvoie :

Code :

cat=[object HTMLSelectElement]&url=[object HTMLInputElement]&actif=[object HTMLInputElement]

Donc jme demande si ya pas encore un problème de concaténation à ce niveau la :

Code :

1
2
    <input type="bouton" name="submit" value="{FORM}" class="button" onclick="aJax('admin_creation.php?id={ID}','corpPage','POST',
    'cat='+document.getElementById('cat')+'&url='+document.getElementById('url')+'&actif='+document.getElementById('actif'));">

[E.Bzz]

Envoyé par Gaara-Manga

A vi en effet ^^"
J'ai rectifié sa.

Par contre jviens de regarder ce que me renvoie parametre, et il me renvoie :

Code :

cat=[object HTMLSelectElement]&url=[object HTMLInputElement]&actif=[object HTMLInputElement]

Donc jme demande si ya pas encore un problème de concaténation à ce niveau la :

Code :

Effectivement : à chaque fois tu oublies les ".value"

J'avais pô vu

A+

[Gaara-Manga]

A ok (décidément va vraiment falloir que jmy mette pour me familiariser avec le langage)

J'ai donc regarder au niveau des paramètres la il passe tout bien.

Mais il s'arrête toujours au chargement -_-

Code :

1
2
3
4
5
6
7
8
9
        element.innerHTML = '<?php echo $Chargement; ?>';
        if(type == "POST")
        {
            xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
            xmlhttp.open("POST", fragment_url);
            xmlhttp.send(parametre);
        }else{
            xmlhttp.open("GET", fragment_url);
        }

PS : merci de prendre de ton temps pour m'aider^^

[E.Bzz]

Je pense qu'il faut déclarer

Code :

1
2
3
4
5
6
7
        xmlhttp.onreadystatechange = function() 
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
            {
                element.innerHTML = xmlhttp.responseText;
            }
        }

avant de faire les open()

Sinon, refais voir comment c'est maintenant (je m'y perds) ...

A+

[Gaara-Manga]

Voila comment il est actuellement :

Code :

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
41
42
43
function aJax( pageToLoad , elementId , type, parametre) {
    var xmlhttp;
 
    if ( typeof XMLHttpRequest != 'undefined' ) {
        try {
            xmlhttp = new XMLHttpRequest();
        } catch(e) {
            xmlhttp = false;
        }
    } else {
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                xmlhttp = false;
            }
        }
    }
 
    function loadFragmentInToElement(fragment_url, element_id, type, parametre) {
        var element = document.getElementById(element_id);
        element.innerHTML = '<?php echo $Chargement; ?>';
        if(type == "POST")
        {
            xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
            xmlhttp.open("POST", fragment_url);
            xmlhttp.send(parametre);
        }else{
            xmlhttp.open("GET", fragment_url);
        }
        xmlhttp.onreadystatechange = function() 
        {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
            {
                element.innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);
    }
    loadFragmentInToElement(pageToLoad, elementId, type, parametre);
}