[Résolu] Filtre recherche multiple

Salut a tous
je débute en ajax/JS et j'essaie de faire un filtre multicritère qui va chercher les infos en BDD
donc une page avec form style :

 ...
        <div class="form-group">
            <select name="region" class="region form-control" id="region">
                <option value="" selected>-- Tous --</option>
                          <option value="region1">region1</option>
                          <option value="region2">region2</option>
                          <option value="region3">region3</option>
          </select>
          </div>
          <div class="form-group">
            <select name="typeT" class="typeT form-control" id="typeT">
                <!--<option selected disabled>Région</option>-->
                <option value="" selected>-- Tous --</option>
                <option value="T1" >T1</option>
                <option value="T2" >T2</option>
                <option value="T3" >T3</option>
                <option value="T4" >T4</option>
            </select>
          </div>


          <div class="table-responsive" id="dynamic_content">
            
          </div>



        </div>
      </div>
    </div>
  </body>
</html>
<script>
  $(document).ready(function(){

    load_data(1);

    function load_data(page, query = '')
    {
      $.ajax({
        url:"fetch.php",
        method:"POST",
        data:{page:page, query:query},
        success:function(data)
        {
          $('#dynamic_content').html(data);
        }
      });
    }

    $(document).on('click', '.page-link', function(){
      var page = $(this).data('page_number');
      var query = $('#region').val();
      load_data(page, query);
    });

    $('#region').change(function(){
      var query = $('#region').val();
      load_data(1, query);
    });

  });
</script>

ma page fetch.php qui traite la requête

...
$query = "
SELECT * FROM residences 
";
if($_POST['query'] != '')
{
  $query .= '
  WHERE region = "'.$_POST['query'].'" 
  ';
}
$query .= 'ORDER BY city ASC ';
...

Cela fonctionne parfaitement mais comme vous le voyez dans le html je voudrait ajouter un autre filtre ici le "typeT"
comment faire pour ajouter un autre champ pris en compte dans l'ajax.

Merci de votre aide
Cdt

Salut,

je ne suis pas expert en sécurité, mais à voir la tête de ton $query dans la page fetch.php, ça m'a l'air ouvert aux injections sql
Il faut partir du principe que l'on ne fait jamais confiance aux informations arrivant de l'utilisateur et qu'il faut donc vérifier le contenu qu'ils envoient avant de s'en servir.

Ensuite je suppose que ce n'est pas ton code, du coup il faut que tu commences par comprendre comment le code fonctionne avant de pouvoir l'adapter à tes besoins

A priori c'est ce bout de code la qui va t’intéresser :

$('#region').change(function(){
      var query = $('#region').val();
      load_data(1, query);
    });

et qui indique que quand tu changes la valeur du select qui a pour id "region" il va exécuter ton traitement ajax (grâce à l'appel à la fonction load_data qui appelera à son tour la fonction $.ajax).

Je n'ai pas compris exactement ce que tu veux faire comme traitement/requête au final, mais du coup il faudra que tu adaptes ce bout de code (ou que tu le dupliques et que tu l'adaptes) pour récupérer la valeur du select qui à pour id "typeT" et exécuter une requête.

En profitant du fait que l'on peut faire des injections sql et en supposant que la colonne s'appelle typeT, on doit pouvoir faire un truc du genre (je n'ai pas tester si cela fonctionne):

$('#region').change(function(){
      var query = $('#region').val()+'" and typeT="'+$('#typeT').val();
      load_data(1, query);
    });

Modifié par Mathieuu (20 Feb 2020 - 14:08)

Bonjour,
Je n'utilise pas le Jquery mais en regardant rapidement une documentation, il me semble que tu passes les variables au serveur par la rubrique data.
Donc si tu modifies data:{page:page, query:query} par data:{page:page, query:query, query2:typeT} tu devrais pouvoir t'en sortir.

En espérant t'avoir aidé.

+1 pour mon voisin du dessus.

Tu es ouvert au injections sql là à cause de la ligne suivant :

WHERE region = "'.$_POST['query'].'" 

imaginons que dans mon formulaire, je remplace la valeur HTML (ou même directement via le javascript avec un fonction anonyme) avec ";drop database".

Du coup ton where va s’arrêter avec le ; puis il va détruire ta base.

pour éviter ce genre de choses on utilise PDO et surtout les requêtes préparés.

Bien sûr tu va devoir réadapter ta connexion php => sql.

Bonjour
ce n'est effectivement pas mon code le but ici comme tu peut le voir est de filtrer une base de donnée (je passe sur les injections sql et la sécurité ce n'est pas le but du post).

j'ai 2 listes déroulantes "région" et "type"

on choisie un région, cela filtre la BDD une première fois et affiche les résultats.
ensuite on choisi dans la deuxième liste déroulante un type et cela re-filtre la BDD par type mais tout en conservant le 1er filtre "région".

Dans ce cas, si le reste tu t'en fous, réfère toi uniquement au poste de Mathieuu qui te fait rajouter typeT dans ta requête

c'est pas que je m'en fou, mais c'est pas le sujet premier du post....

Mathieuu a écrit :

$('#region').change(function(){
      var query = $('#region').val()+'" and typeT="'+$('#typeT').val();
      load_data(1, query);
    });

cela ne fonctionne pas car cela prends en compte que le 1er menu déroulant

Bah faut juste rajouter typeT dans le selecteur d'évenement, de change(). juste après region.

j'ai rajouté ce que tu ma dit
et c'est presque bon

   $('#region, #typeT').change(function(){
      var query = $('#region').val()+'" and typeT="'+$('#typeT').val();
      load_data(1, query);
    });

sauf que quand on selectionne la "region" en premier cela n'affiche rien car il faut sélectionner le typeT également pour que cela affiche un résultat.

il faudrait que quand je sélectionne la région cela affiche tous les bien de la région sélectionnée.
Puis quand je choisi le type que cela affiche les bien de la région sélectionnée avec le type sélectionné.
Modifié par spawns (20 Feb 2020 - 15:45)

je me réponds,
avec un if ça passe.

maintenant sécurisation contre les injections

Oui soit un if, soit du "découpe" et tu fais deux .change() un pour ta première liste l'autre pour la seconde liste.

Pendant que je te tiens concernant la sécurisation comment je transforme

...
$query = "
SELECT * FROM residences 
";
if($_POST['query'] != '')
{
  $query .= '
  WHERE region = "'.$_POST['query'].'" 
  ';
}
$query .= 'ORDER BY city ASC ';
...

en requete securisé / préparé, pas l'habitude de PDO

Avec une nouvelle connexion de type PDO

$connexion = new PDO('mysql:host='.$PARAM_hote.';dbname='.$PARAM_nom_bd, $PARAM_utilisateur, $PARAM_mot_passe);

Il te faut donc PDO dans tes extension de serveur web.

et après tu peux faire ce genre de truc

$condition_where = $_POST['query']; // ici je rajouterais également une sécurité. 
$requete = $connexion->prepare("SELECT identifiant FROM membres WHERE ID_membre = :id"); // on prépare notre requête
$requete ->execute(array( 'id' => condition_where  ));

Modifié par JENCAL (20 Feb 2020 - 16:16)

ok merci
je regarde tous cela.

Bonjour,
Je n'utilise pas le Jquery mais en regardant rapidement une documentation, il me semble que tu passes les variables au serveur par la rubrique data.
Donc si tu modifies data:{page:page, query:query} par data:{page:page, query:query, query2:typeT} tu devrais pouvoir t'en sortir.

En espérant t'avoir aidé.


<snip>signature manuelle suppriméepar un modo</snip>

Modifié par Felipe (21 Feb 2020 - 14:43)