Bonjour,
quand j'essaie de rentrer dans l'événement change() d'une liste déroulante dynamique, il n'exécute pas le code qui se trouve à l'intérieur.
Il n'intercepte pas l'event suivant : $('#country-'+$('#COUN_ID').val()).change(function(event){});
voici mon code javascript/jQuery :
Voici le code HTML :
Avez-vous une idée à propos du fait que l'événement change() ne se déclenche pas ?
Est-ce possible de déclencher un event sur un sélecteur dont le nom est dynamique (ex : country-1, country-2, ...) ?
Merci d'avance
Bonne journée
Thierry
quand j'essaie de rentrer dans l'événement change() d'une liste déroulante dynamique, il n'exécute pas le code qui se trouve à l'intérieur.
Il n'intercepte pas l'event suivant : $('#country-'+$('#COUN_ID').val()).change(function(event){});
voici mon code javascript/jQuery :
(function($){
var postcodes_table = {};
$("#post_codes select").each(function(){
// Pour éviter de réutiliser le selecteur tout le temps
var select_postcode = $(this);
postcodes_table[select_postcode.attr('id')] = select_postcode;
select_postcode.remove();
});
$('#COUN_ID').change(function(event){
var country_id = $(this).val();
if (country_id == 0)
{
$("#post_codes").hide();
}
else
{
$("#post_codes").show();
$("#post_codes").empty().append(postcodes_table['country-'+country_id]);
}
}).trigger('change');
var cities_table = {};
$("#cities select").each(function(){
var select_city = $(this);
cities_table[select_city.attr('id')] = select_city;
select_city.remove();
});
$('#country-'+$('#COUN_ID').val()).change(function(event){
var postal_code_id = $(this).val();
if (postal_code_id == 0)
{
$("#cities").hide();
}
else
{
$("#cities").show();
$("#cities").empty().append(cities_table['postcode-'+postal_code_id]);
}
}).trigger('change');
})(jQuery);
Voici le code HTML :
<!-- Registration Form -->
<div class="row">
<div class="col-lg-4 offset-lg-4 bg-light rounded register-class" id="register-box">
<h2 class="text-center mt-2">Register</h2>
<form action="" method="post" role="form" class="p-2" id="register-form">
<div class="form-group countries" id="countries">
<select name="COUN_ID" id="COUN_ID" class="form-control">
<option value="0">Sélectionnez un pays ...</option>
<?php foreach ($countries as $country): ?>
<option value="<?= $country->COUN_ID; ?>"<?= $country_id == $country->COUN_ID ? ' selected' : ''; ?>><?= $country->COUN_TITLE; ?></option>
<?php endforeach ?>
</select>
</div>
<div class="form-group postcodes" id="post_codes">
<?php foreach ($postcodesByCountry as $countryId => $postalCodes): ?>
<select name="POST_ID" id="country-<?= $countryId; ?>" class="form-control">
<option value="0">Sélectionnez un code postal ...</option>
<?php foreach ($postalCodes as $postalCodeId => $postalCodeName): ?>
<option value="<?= $postalCodeId; ?>"<?= $postcode_id == $postalCodeId ? ' selected' : ''; ?>><?= $postalCodeName; ?></option>
<?php endforeach ?>
</select>
<?php endforeach ?>
</div>
<div class="form-group cities" id="cities">
<?php foreach ($citiesByCountry as $postCodeId => $towns): ?>
<select name="CITY_ID" id="postcode-<?= $postCodeId; ?>" class="form-control">
<option value="0">Sélectionnez une ville ...</option>
<?php foreach ($towns as $townId => $townName): ?>
<option value="<?= $townId; ?>"<?= $city_id == $townId ? ' selected' : ''; ?>><?= $townName; ?></option>
<?php endforeach ?>
</select>
<?php endforeach ?>
</div>
<div class="form-group">
<input type="submit" name="register-btn" id="register-btn" value="Inscription" class="btn btn-primary btn-block">
</div>
</form>
</div>
</div>
Avez-vous une idée à propos du fait que l'événement change() ne se déclenche pas ?
Est-ce possible de déclencher un event sur un sélecteur dont le nom est dynamique (ex : country-1, country-2, ...) ?
Merci d'avance
Bonne journée
Thierry
