Choisir la ville suivant le code postal

Version imprimable

Bonjour,
Le principe est dans le titre. Je n'ai pas d'erreur javascript, mais quelque chose doit clocher dans mon système. Voici mon code :

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
        <div class="form-row">
            <div class="form-group col-md-4">
              <label for="Ville">Ville</label>
              <input list="ice-cream-flavors" id="ice-cream-choice" name="ice-cream-choice" class="form-control" />
              <datalist id="ice-cream-flavors">
                <select type="text" class="form-control client_ville" onchange="send_postalcode(this.value)">
                  <?php $list = $bdd->query('SELECT DISTINCT * FROM ville ORDER BY ville_nom ASC');
                  while ($data = $list->fetch()) { ?>
                      <option value="<?php echo $data['ville_nom']; ?>"> <?php echo $data['ville_nom']; ?></option>
                  <?php } $list->closeCursor(); ?>
                </select>
              </datalist>
            </div>
            <div class="form-group col-md-4">
              <label for="Postal">Code Postal</label>
              <div class="load_postalcode">
                    Le produit sera chargé ici
              </div>
            </div>
        </div>
<script>
      /* select le code postal quand la ville est choisit */
      function send_postalcode(city_ref){
          var city_ref = $(this).val();
          var load_postalcode = $(this).find('.load_postalcode'); // je pense que c'est ici que ça ne va pas
          $.ajax({
            url: "modal_header/Client/ajax/inputpostalcode.php",
            method: "POST",
            data: { city_ref: city_ref }
          })
          .done(function( retour_html ) {
            load_postalcode.html( retour_html );
            console.log( "success ajax client" );
          })
          .fail(function() {
            console.log( "error facture creation ajax" );
          });   
        }
</script>

et le inputpostalcode.php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php include '../../../../Include/connect.php' ; 
 
    $city_ref  = (array_key_exists('city_ref', $_POST)) ? $_POST['city_ref']: NULL; 
    if ($city_ref) {
        $stmt = $bdd->prepare('
            SELECT * FROM client
            WHERE client_ville = :code
        ');
        $stmt->bindValue(':code', strtoupper($city_ref), PDO::PARAM_STR);
        $stmt->execute();
        if ($donnees = $stmt->fetch(PDO::FETCH_ASSOC)) { ?>
            <input class="form-control client_codepostal_add" type="text" value="<?php echo $donnees['client_codepostal'] ?>" />  
 
        <?php 
        }
    }
?>

Merci :) (PS : si vous voyez des améliorations possibles, je suis preneur aussi

06/09/2019, 17h23
Toufik83
Salut,

Essaies
Code:

1 2 var load_postalcode=$(this).closest('.form-group').next('.form-group').find('.load_postalcode');
Remarque : Puisque tu importes jquery, alors il faut l'utiliser correctement, c'est à dire supprimer l'attribut "onchange" et le remplacer par

Code:

$(".client_ville").on("change",function(){/* ton code ici ...*/})
06/09/2019, 18h08
Invité

+1
J'ajoute que :
1- inutile d'utiliser * :

Code:

<?php $list = $bdd->query('SELECT DISTINCT ville_nom FROM ville ORDER BY ville_nom ASC');

idem si tu ne veux récupérer que le CP :

Code:

SELECT client_codepostal FROM client

2- et en UTF-8, il faut utiliser mb_strtoupper().

Merci pour vos précieux conseils. Je les ai tous appliqué à mon code.

J'ai trouvé le problème : il venait du fait que je devais viser l'input plutôt que ma datalist. En clair :

Code:

1
2
3
              <input list="ice-cream-flavors" id="ice-cream-choice" name="ice-cream-choice" class="form-control client_ville" />
              <datalist id="ice-cream-flavors">
                <select type="text" class="form-control">

au lieu de

Code:

1
2
3
              <input list="ice-cream-flavors" id="ice-cream-choice" name="ice-cream-choice" class="form-control" />
              <datalist id="ice-cream-flavors">
                <select type="text" class="form-control client_ville">

Merci pour vos remarques, vous m'avez bien aidé! Sujet résolu