Dropdown ajax - Boostrap

Pour toutes les discussions javascript, jQuery et autres frameworks
Répondre
oitsuku
Messages : 1
Enregistré le : 26 févr. 2021, 09:52

Dropdown ajax - Boostrap

Message par oitsuku » 26 févr. 2021, 10:00

Bonjour,

Depuis quelque temps mon dropdowwn ajax ne fonctionne plus,je suppose que c'est le passage à Boostrap 5 mais j'en suis pas sur.
- Sur une modale je crée une nouvelle catégorie
- Je clique sur la dropdown et la catégorie devrait apparaitre, ce qui ne ne se fait pas

Merci

1ere poartie le code
data-bs-refresh="true". Peux etre un probléme ici ?

Code : Tout sélectionner

       $content .= '<div id="myAjax">';
        $content .= HTML::selectMenu('move_to_category_id[]', $category_tree, $current_category_id, 'id="move_to_category_id"');
        $content .= '</div>';
        $content .= HTML::hiddenField('current_category_id', $current_category_id);
        $content .= '<a href="' . $this->app->link('CategoriesPopUp') . '"  data-bs-toggle="modal" data-bs-refresh="true" data-bs-target="#myModal">' . HTML::image($this_Template->getImageDirectory() . 'icons/create.gif', $this->app->getDef('text_create')) . '</a>';
        $content .= '<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">';
        $content .= '<div class="modal-dialog">';
        $content .= '<div class="modal-content">';
        $content .= '<div class="modal-body"><div class="te"></div></div>';
        $content .= '</div> <!-- /.modal-content -->';
        $content .= '</div><!-- /.modal-dialog -->';
        $content .= '</div><!-- /.modal -->';
        $content .= '</div>';
le javascript

Code : Tout sélectionner


<script>
$('#tab1ContentRow1').append(
    '{$content}'
);
</script>

le fichier est bien lu et la console affiche la nouvelle données. Donc peut etre c'est au niveau duu refresh de la dropdown.

<script>
  jQuery(document).ready(function() {
    $("#myAjax").on('click', function () {
      var selectedOptionVal = $('#category_id').val();
      $.ajax({
        url: '{$categories_ajax}',
        dataType: 'json',
        success: function (data) {
          //data returned from php
          var options_html = '';
          for (var index in data) {
            var category_id = data[index]['id'];
            var category_name = data[index]['text'];
            var selectedString = category_id == selectedOptionVal ? ' selected="selected"' : '';
            options_html += '<option value="' + category_id + '"' + selectedString + '>' + category_name + '</option>';
          }
          $('#category_id').html(options_html);
        }
      });
    });
  })


Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: Dropdown ajax - Boostrap

Message par webmaster » 03 mars 2021, 10:16

Bonjour,

J'ai tenté de reproduire le rendu, mais c'est délicat car je n'ai pas les classes PHP qui génèrent le contenu et la liste.

Je pourrai regarder avec le code HTML généré.
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

Répondre