Discussion :

[Evooso]

Bonjour !

Je me permets de vous écrire ici car je suis confronté à un problème de logique..
J'espere deja être dans la bonne partie :/

J'explique mon besoin

Je souhaite avoir sur ma page :

- 5 listes déroulantes (contenant un critère de requête SQL)
et
- L'affichage du résultat de cette requête.

A savoir :

Liste déroulante N°1 : Le sexe (H/F)
Liste déroulante N°2 : L'age (20-30 ans / 31-40 ans / 41-50 ans etc...)
Liste déroulante N°3 : La profession ( Informaticien, infographiste, banquier etc.. )
Liste déroulante N°4 : La région (Centre, Aquitaine, Alsace etc... )
Liste déroulante N°5 : La somme totale des achats ( <50€ / 50-100€ / 100-150€ etc..)

Ensuite ma requête devrait tourner de la sorte :

Code sql :

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

SELECT * FROM 'table' WHERE ID <>'' AND Sexe='ListeDeroulante_1' AND Age='ListeDeroulante_2' AND Profession='ListeDeroulante_3' AND Region='ListeDeroulante_4' AND Somme='ListeDeroulante_5';

-----------
Voila pour le fonctionnement.. Maintenant, dans l'affichage, j'aimerai avoir le resultat dans une div, sur la meme page que mes listes déroulantes..

Et je ne vois absolument pas comment faire..
On me parle d'AJAX, ou de onchange= document.getelementbyid('form1').submit().. Mais je connais pas bien ces choses la..



Avez-vous une idée de comment réaliser ce chantier ?
Merci d'avance !
Cordialement, evooso

[NoSmoking]

Bonjour,
tu peux toujours commencer par regarder Les ressources sur l'AJAX ainsi que Listes déroulantes liées entre elles .

Tu auras surement intérêt à optimiser tes requêtes quand même.

[Evooso]

D'accord merci !
Merci je regarde ces sources, meme si je les connaissait deja :p

En quoi les liste liées peuvent m'aider ? :/ Mes listes n'ont pas besoin de l'être

[Watilin]

Bonjour,

je ne sais pas si tu en es conscient mais tu ne peux pas faire ta requête SQL directement depuis ta page. L'opération se fait en deux étapes :
1. Ta page envoie au serveur web les informations sélectionnées par l'utilisateur ;
2. Le serveur web envoie la requête SQL au serveur SQL.
Tu as deux serveurs distincts : le serveur web, sur lequel tournent tes scripts PHP, et le serveur SQL qui gère les bases de données. Même s'ils sont parfois sur la même machine, il s'agit bien de deux logiciels différents. Ajoute à ça le navigateur/client et tu as ce qu'on appelle une architecture 3 tiers.

Si tu n'es pas à l'aise avec Ajax, le mieux est de commencer par mettre en place un formulaire classique. Tu pourras ensuite le transformer en Ajax sans toucher au code HTML. Voilà une suggestion pour la structure de ton formulaire :

Code HTML :

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
<form id="le-form" method="POST" action="nom_de_ton_fichier.php">
  <p>
    <label for="sexe">Sexe</label>
    <select name="sexe" id="sexe">
        <option value="H">Homme</option>
        <option value="F">Femme</option>
    </select>
  </p>
  <p>
    <label for="age">Âge</label>
    <select name="age" id="age">
        <option value="20-30">20 à 30 ans</option>
        <option value="31-40">31 à 40 ans</option>
        <!-- etc. -->
    </select>
  </p>
  <!-- etc. -->
 
  <p>
    <input type="submit" name="submit" value="Envoyer" />
  </p>
</form>

Les id des champs doivent correspondre aux for des labels. Les name permettent de transmettre les données au serveur web. On met souvent la même chose dans name et dans id mais ce n'est pas obligatoire.

Tu peux ensuite décorer cette structure HTML avec du code CSS dans une balise <style> ou dans un fichier externe. Normalement tu n'as pas besoin de rajouter du code HTML dans le <form>.

---

Pour transformer ce formulaire en Ajax quand tu seras prêt, il te suffira d'intercepter son évènement submit comme ceci :

Code JS :

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

1
2
3
4
document.getElementById("le-form").addEventListener("submit", function(event) {
    event.preventDefault();
    // ... prépare et envoie ta requête Ajax ici
});

Ou si tu utilises jQuery :

Code JS :

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

1
2
3
4
5
6
$("#le-form").submit(function(event) {
    event.preventDefault();
    $.post({
        // ... les paramètres de ta requête Ajax
    });
});

---

Côté PHP, ajoute temporairement un print_r($_POST); pour vérifier que ton formulaire marche correctement. Pour faire ta requête SQL utilise mysqli::prepare ou PDO::prepare pour éviter les risques d'injection.

Je te conseille également de contrôler les valeurs reçues. Dans la mesure où tu connais l'ensemble des valeurs possibles, ça n'est pas trop difficile. Voici une suggestion :

Code PHP :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function checkProfession( $value ) {
    $value = strtolower(trim($value));
    return in_array($value, array(
        'informaticien',
        'infographiste',
        'banquier',
        // etc.
    ));
}
 
// ...
if ( !checkProfession($_POST['profession']) ) {
    die('Profession incorrecte !');
}

Bien sûr le die est une façon de faire un peu brutale, mais c'est pour te donner l'idée générale.

---

Finalement, pour afficher le résultat dans une <div> sur la même page, il te faudra obligatoirement Ajax. Sinon la page se recharge. Fais les choses dans l'ordre, vérifie d'abord que tout ce qui marche sans Ajax fonctionne correctement. Ensuite, il suffira d'ajouter du code dans la fonction de callback de ton appel Ajax. Ce code récupèrera la réponse du serveur, créera une <div> et injectera cette <div> dans le DOM de la page.

[Evooso]

Haw... !
Merci Watilin pour ta réponse plus que construite et expliquée

J'ai deja un dossier ou j'avais tout coder en PHP (Formulaire et action (avec requête sql dans action))

Je ne sais pas si je peux éventuellement te filer le code pour que tu m'aiguilles un peu plus sur comment passer ca en AJAX ?! :s
(Les 2 fichiers sont très longs, je te les raccourciraient à 2-3 listes déroulantes ( j'en ai 40 sinon ^^ )

Si oui c'est super, sinon, je vais essayer de me débrouiller mais je t'avoue avoir pas mal fait de forum pour m'aider a construire mon projet

Merci malgré tout ! J'attends ta réponse

[Golgotha]

Bonjour Evooso,

Qu'est ce qui te bloque personnellement, c'est l'ajax que tu ne comprends pas ?

[Evooso]

Salut Golgotha

L'ajax.. Oui il y a de ca, mais avec tout les tutos que je bouffe depuis Lundi matin.. Je pense commencer a comprendre..

Mon réel soucis est que je ne comprends pas comment récupérer mes valeurs au moment ou je sélectionne une option de mon SELECT.. En effet, après avoir fait plusieurs tutos (surtout ceux des listes déroulantes liées) je ne comprends pas trop comment cela fonctionne réellement..

Exemple : J'ai fais le tuto AJAX où il y a 2 liste déroulantes, une région et l'autre département.. J'ai réussi a ajouter une troisieme liste déroulante 'pays' afin de m'exercer.. Et ca marche
Seulement, quand je ne veux pas les faire dépendre les unes des autres, mais les faire fonctionner ensemble.. J'ai un soucis.. (Ici mon soucis est que mes 2 parametres GET s'enregistre dans la meme "variable".. Je m'explique..

j'ai une fonction :
function getTout(idr, idp)

J'ai mes 2 listes déroulantes :
Liste des Pays => idp
Liste des Regions -> idr

Et quand je choisi sur ma page les options dans les listes .. J'ai ca :
.
2015-03-12 08:15:49.353
dept_xhr.js:198 XHR finished loading: GET "http://localhost:8888/Region_dept_AJAX/tout.php?idr=ESP&idp=undefined".
2015-03-12 08:15:52.327
dept_xhr.js:198 XHR finished loading: GET "http://localhost:8888/Region_dept_AJAX/tout.php?idr=1&idp=undefined".
.

idp doit recevoir le pays (ESP, ITA, POR, FRA)
idr doit recevoir la region (Aquitaine, Centre, Alsace etc..)

Cependant, mes deux GET s'enregistre de le meme parametre.. Et je n'arrive bien évidemment pas a le débogguer...

Sachant qu'a terme, j'aurai une quarantaine de liste déroulantes et chaque valeur des listes devra etre dans une requete sql.. Je sais pas si je suis clair :/

[NoSmoking]

Lors de l'utilisation de listes liées on émet une requête sur le onchange d'un SELECT.

Si tu n'as pas besoin de liées tes liste, ce qui semble bien être ton cas ( ma 1st réponse), il te faut au moment de la requête Ajax faire le tour de tous les champs que tu veux transmettre.

[Watilin]

Haw... !
Merci Watilin pour ta réponse plus que construite et expliquée

J'ai deja un dossier ou j'avais tout coder en PHP (Formulaire et action (avec requête sql dans action))

Je ne sais pas si je peux éventuellement te filer le code pour que tu m'aiguilles un peu plus sur comment passer ca en AJAX ?! :s
(Les 2 fichiers sont très longs, je te les raccourciraient à 2-3 listes déroulantes ( j'en ai 40 sinon ^^ )

Si oui c'est super, sinon, je vais essayer de me débrouiller mais je t'avoue avoir pas mal fait de forum pour m'aider a construire mon projet

Merci malgré tout ! J'attends ta réponse

Poste ton code raccourci ici, comme ça tout le monde pourra en profiter