Bonjour,

Nouveau sur le forum je ne suis pas parvenu à trouver solution en fouillant sur le net. J'espère donc pouvoir trouver un peu d'aide parmi vous sur un problème d'affichage d'une balise <select multiple> après l'avoir mise à jour par AJAX.

Sur une base de données, j'enregistre des fiches contenant différentes informations donc différents champs. Parmi ces champs se trouve la ou les "catégorie(s) de la fiche", sélectionnée(s) par le biais d'une balise <select multiple >.

Pour créer la fiche tout va bien et voilà à quoi ressemble le <select multiple> une fois les catégories sélectionnées : https://drive.google.com/file/d/1gDRgdq ... sp=sharing

Mon problème survient lors de l'édition d'une fiche pour modification via l'affichage d'un <DIV> préalablement chargé et caché sur la page HTML principale où sont listées toutes les fiches.

Toutes les données sont bien récupérées et tout fonctionne correctement mais l'affichage du <select multiple ="multiple"> devient cela : https://drive.google.com/file/d/1fSh7gG ... sp=sharing

Pour finir, mon problème est que je ne parviens pas à afficher le <select multiple> avec les vignettes de chaque catégories comme sur la première image : https://drive.google.com/file/d/1gDRgdq ... sp=sharing

Avez vous une solution à proposer svp ?

DIV où est injecté le code du <select multiple> (il est contenu dans le DIV initialement caché utilisé comme fenêtre d'édition)

Code : Tout sélectionner

<div id="div-categ"></div>

Script php appelé par ajax

Code : Tout sélectionner

<?php $response = array('status' => 0); $sql = "SELECT * from categories"; $rs = $conn->execute($sql); if ( $conn->Affected_Rows()) { $toutes_categories = $rs->getrows(); $response['toutes_categories'] = $toutes_categories; } $sql = "SELECT * from f_categories WHERE FID = " .$conn->qStr($fid); $rs = $conn->execute($sql); if ( $conn->Affected_Rows()) { $fiches = $rs->getrows(); $fiche_categories = array(); $i=0; foreach ($fiches as $key => $value){ $fiche_categories[$i]=$value; $i++; } $response['fiche_categories'] = $fiche_categories; } echo json_encode($response); die(); ?>

Script ajax appelé par un bouton

Code : Tout sélectionner

$(document).ready(function(){ $("body").on('click', "a[id*='edit_fiche_']", function(event) { event.preventDefault(); var id = $(this).attr('id'); var split = id.split('_'); var fiche_id = split[2]; $.post(base_url + '/ajax/admin_get_fiche', { fiche_id: fiche_id }, function (response) { if (response.status) { //Réinitialiser les erreurs $('.form-control').each(function(){ $(this).removeClass('error'); }); //Charger les données fiche var fichecategories = new Array(); var toutescategories = new Array(); fichecategories = response.fiche_categories; toutescategories = response.toutes_categories; out = '<select id="edit-category" name="edit-category[]" multiple style="width:100%";>'; for (var i in toutescategories) { objall = Object.values(toutescategories[i]); var match = 0; for (var j in fichecategories) { var objvid = Object.values(fichecategories[j]); if (objall[0] == objvid[1]){ match = 1; } } if (match != 0){ out += '<option value="'+ objall[0] + '" selected="selected">'+ objall[1] +'</option>'; } else { out += '<option value="'+ objall[0] + '">'+ objall[1] +'</option>'; } } out += '</select>'; $('#div-categ').html(out); //Ajuste la marge de gauche à une valeur entière - Centre var modal_ml = parseInt(($(window).width()-$('#editModalDialog').width())/2); $('#editModal').modal('show'); if ($(window).width()>768) { $('#editModalDialog').css('margin-left',Math.floor(modal_ml)+'px'); } } else { Messenger().post({ message: 'Fiche <b>ID ' + fiche_id + '</b>: Echec d\'obtention des détails de la fiche !', type: 'error' }); } }, "json"); }); });

je penses que le problème vient du fait que le style n'est pas appliqué à ton multiple, parce qu'il est affiché après chargement de la page, j'avais un peu le même problème similaire

regarde sur internet avec : "faire reconnaitre le jquery sur des éléments chargés en javascript"