Récupération valeur select dans une meme page sans submit [Résolu]

Signaler
Messages postés
2
Date d'inscription
lundi 30 novembre 2020
Statut
Membre
Dernière intervention
8 décembre 2020
-
Messages postés
2
Date d'inscription
lundi 30 novembre 2020
Statut
Membre
Dernière intervention
8 décembre 2020
-
Bonjour,

Malgré mes recherches sur internet, je n'arrive pas à récupérer la valeur d'un select, qui me permettra d'alimenter un second select sur une même page.

J'ai une première liste déroulante (categorie_rev) dont les données proviennent de la table "budget_produit" composée de 2 champs ("id_cat_rev" et "categorie_rev"). (cette partie là est OK)

J'ai une seconde liste déroulante (type_rev) dont les données proviennent de la table "budget_ss_produit" composée de 3 champs ("id_rev", "cat_rev_id" type_rev).

Pour alimenter ma seconde liste déroulante j'ai besoin de id_cat_rev de la première liste déroulante

car je vous sélectionner toutes les entrées dans budget_ss_produit où cat_rev_id = id_cat_rev

Pour ce faire, je voudrais récupérer la valeur de catégorie_rev (de ma première liste déroulante) sous forme de variable PHP afin de construire ma requête de la seconde liste.

Je précise que je suis vraiment débutant et que l'AJAX n'était pour moi qu'un club de football ou un produit ménager il y a encore 24h00. Pour faire simple je suis totalement nul.

Bon j'espère avoir été assez clair.

Quelqu'un aurait-il la gentillesse de me guider SVP

Par avance merci à vous.

François


Ci-dessous ma prose :

Page HTML avec les 2 select
<label style="display: inline-block; width: 120px;" class="edit_tiers_sans_tabulation" for="categorie_rev"><strong>Catégorie :</strong></label>
<Select required style="display: inline-block; width: 243px;" class="edit_tiers_sans_tabulation  TypeRevenu" id="categorie_rev" type="text" name="categorie_rev" onchange="idcatrev.value=this.value;">
     <option value="">Sélectionner</option>
     <?php
          while ($catrev = $resultatcatrev->fetch()) {
     ?>
     <option value="<?= $catrev['id_cat_rev']?>"><?=$catrev['categorie_rev'] ?></option>';
     <?php
     }
     $resultatcatrev->closeCursor();
     ?>
</select>

<input style="width: 40px;" name="idcatrev" id="idcatrev" type="text" value=""> <!-- POUR VERIFIER LA VALUE DE "categorie_rev" A ENLEVER OU CACHER DES QUE LA SOLUTION EST TROUVEE !!!! -->

<label style="display: inline-block; width: 120px;" class="edit_tiers_avec_tabulation" for="type_rev"><strong>Nature :</strong></label>
<Select required style="display: inline-block; width: 243px;" class="edit_tiers_sans_tabulation" id="type_rev" type="text" name="type_rev">
     <option value="">Sélectionner</option>
     <?php
     $resultnatrev = $bdd->prepare('SELECT * FROM budget_ss_produit WHERE cat_rev_id = $type_rev  ');
     $executeIsOk4 = $resultnatrev->execute();
          while ($natrev = $resultnatrev->fetch()) {
     ?>
      <option value="<?= $natrev['id_rev']?>"><?=$natrev['type_rev']?></option>
      <?php    
     }
     $resultatnatrev->closeCursor();
     ?>
      </select>


Page de traitement PHP
<?php
$bdd = new PDO('mysql:host=localhost;dbname=PVSOFT', 'root', 'root');

$RevId = !empty($_POST['idcatrev']) ? $_POST['idcatrev'] : NULL;

$query = ("SELECT * FROM budget_ss_produit WHERE id_rev = ('SELECT nature_rev FROM revenus WHERE id_rev = $RevId')");

json_encode(array('idtypereve'=>$query));


Partie JAVASCRIPT
<script>
        $(document).ready(function(){
            $(".TypeRevenu").change(function(){
                $.ajax({
                    url: 'TypeRevenu.php', 
                    type: 'POST',
                    data: 'rev_id=' + rev_id,
                    dataType: "json",
                    success: function(data){
                    console.log(data);
                    $type_rev.val(data.idtypereve);    
                    },
                    error: function(jqXHR,textStatus){
                    console.log(textStatus,jqXHR);
                    alert('Error AJAX !');
                    }
                });
            });
        });
    </script>

2 réponses

Messages postés
30862
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
6 janvier 2021
3 145
Bonjour,

Côté Javascript
Déjà, au lieu d'envoyer les données sous la forme
 data: 'rev_id=' + rev_id,

fais le sous la forme
 data: {rev_id:  rev_id},


ensuite, d'où vient ta variable rev_id ?
Il semble que tu aies oublié de récupéré la valeur choisie dans ton select
$(".TypeRevenu").change(function(){
   var rev_id = $(this).val();


Dans le PHP côté ajax, tu essaies de récupérer la variable
$_POST['idcatrev']

... alors que dans le js, le nom de ta variable est rev_id ...

Donc, dans le php, il faut récupérer rev_id
$RevId = !empty($_POST['rev_id']) ? $_POST['rev_id'] : NULL;


Côté php toujours... tu n'exécutes pas ta requête... ... ça ne fonctionnera donc pas....

et tu as oublié de mettre un "echo" devant ta dernière ligne

Sans oublié que ta requête elle même semble boiteuse.....



Et comme tu fais du PDO, je t'invite fortement à appliquer les conseils donnés ici :
https://www.commentcamarche.net/faq/46512-pdo-gerer-les-erreurs

PS: Pense que pour débuguer de l'ajax, il faut regarder dans la console de ton navigateur
et, pour plus de facilités, utiliser le navigateur firefox... ( et penser à activer le debug xhr )


Et regarder, au niveau de la ligne qui correspond à ton appel ajax ( celle qui commence par >post ) de regarder l'onglet Paramètres ( pour voir ce que tu envoies... ) et l'onglet REPONSE pour voir.. ben.. ce que ton script php retourne


Messages postés
2
Date d'inscription
lundi 30 novembre 2020
Statut
Membre
Dernière intervention
8 décembre 2020

Bonjour Jordane,

et un grand merci d'avoir pris le temps de me lire et de m'aider.

Au bout d'une semaine, j'ai enfin réussi à solutionner mon problème.

Pour ceux qui le souhaitent, je peux transmettre ma solution.

François