I have an issue with my array in JS, (and of course i'm learning JS, I'm really bad for the moment.)
The fact is my select is printing my array values where the value of the select is equal to either 'mobile' and 'desktop'
Here is my main problem : I want to add a new value to print them all ! I tried to add a bidimensionnal array for every value but since I'm just bad with JS, I did not managed to do it.
Here is my JS :
function afficher_lst_appareils() {
// On supprime tous les appareils de la liste déroulante
$('#lst_appareils').empty().prepend("<option value='0'>Sélectionnez un type d'appareil</option>");
// Le type d'appareil / système qu'on a sélectionné
var type_appareil = $('#lst_types_appareils').val();
var lst_appareils_assoc = {
'Windows 10' : 'desktop',
'Windows 8.1' : 'desktop',
'Windows 8' : 'desktop',
'Windows 7' : 'desktop',
'Windows Server 2003/XP x64' : 'desktop',
'Windows XP' : 'desktop',
'Windows 2000' : 'desktop',
'Windows ME' : 'desktop',
'Windows 98' : 'desktop',
'Windows 95' : 'desktop',
'Windows 3.11' : 'desktop',
'Windows Vista' : 'desktop',
'Linux' : 'desktop',
'Ubuntu' : 'desktop',
'Mac OS X' : 'mobile',
'Mac OS 9' : 'mobile',
'iPhone' : 'mobile',
'Android' : 'mobile',
'iPod' : 'mobile',
'iPad' : 'mobile',
'BlackBerry' : 'mobile',
'Mobile' : 'mobile'
};
// On parcourt le tableau représentant l'ensemble des OS / appareils
$.each(lst_appareils_assoc, function(key, value) {
// Si le type de système / appareil correspond à celui sélectionné et s'il est présent en base,
// on prend sa clé (le nom du système / de l'appareil)
if (type_appareil === value && jQuery.inArray(key, arr) !== -1) {
// Si le nom de l'OS (correspondant à la clé) correspond avec celui soumis au formulaire,
// on le pré-sélectionne grâce à l'attribut selected
if (nom_os !== 0 && nom_os === key) {
$('#lst_appareils').append('<option value="' + key + '" selected>' + key + '</option>');
$("#lst_appareils option:eq(0)").text('-');
//$('#zone_lst_appareils').show();
} else { // Sinon on rajoute les autres normalement
$('#lst_appareils').append('<option value="' + key + '" >' + key + '</option>');
$("#lst_appareils option:eq(0)").text('-');
//$('#zone_lst_appareils').show();
}
}
});
}
// On l'appelle par défaut
afficher_lst_appareils();
// Gestion de l'affichage des appareils selon le type d'appareil sélectionné
$('#lst_types_appareils').on('change', function() {
afficher_lst_appareils();
var nom_os = 0;
});
Thanks !
(Here is my HTML in case..)
<div class="form-group">
<label class='col-xs-4 col-md-2 col-lg-2 control-label'>Type d'appareil :</label>
<div class='col-xs-8 col-sm-8 col-md-4 col-lg-4'>
<select name='lst_types_appareils' id="lst_types_appareils" class='form-control'>
<option value='tous' <?php if( isset( $valeurs_form[ 'lst_types_appareils'] ) && $valeurs_form[ 'lst_types_appareils']==='' ) echo 'selected'; ?> >Tous</option>
<option value='desktop' <?php if( isset( $valeurs_form[ 'lst_types_appareils'] ) && $valeurs_form[ 'lst_types_appareils']==='desktop' ) echo 'selected'; ?>>Desktop</option>
<option value='mobile' <?php if( isset( $valeurs_form[ 'lst_types_appareils'] ) && $valeurs_form[ 'lst_types_appareils']==='mobile' ) echo 'selected'; ?> >Mobile</option>
</select>
</div>
<div id='zone_lst_appareils'>
<label class='col-xs-4 col-md-2 col-lg-2 control-label' for='lst_appareils'>Liste des systèmes :</label>
<div class='col-xs-8 col-sm-8 col-md-4 col-lg-4'>
<select name='lst_appareils' id="lst_appareils" class='form-control'>
<option value="0">Sélectionnez un type d'appareil</option>
</select>
</div>
</div>
</div>
I let the french commentaries, in case you want to translate it, just tell me.
Oh and I forgot to tell that the 2nd select is supposed to print in function of 1st select value.
arrandnom_osdefined?