Lorsque je clique sur le lien avec télécommande: true, pas initialise le plugin

Question

Dans mon application.js je l'initialisation de .select2 Selects:

$(document).ready(function() { 
    $(".select2").select2({ 
    theme: "bootstrap", 
    width: '100%', 
    allowClear: true 
    }); 
}); 

Dans une autre partie de ma demande, j'ai un lien avec remote: true, ce qui rend un nouveau formulaire avec une liste déroulante avec .select2:

<%= link_to 'new form' new_feed_item_path, class: 'new-feed-item', remote: true %> 

que comme une réponse partielle à la charge: new.js.erb

$('.feed-content').html("<%= j(render 'form', feed_item: @feed_item) %>"); 

Mais la sélection ne fonctionne pas si elle est chargée de cette manière. Pourquoi? Dois-je initialiser le js à nouveau? Je n'utilise pas turbolinks dans mon application.

Answer 1

Vous devriez mettre le bloc qui initialise la sélection à l'intérieur du new.js.erb aussi, parce que l'événement $(document).ready ne se déclenche pas lorsque vous recevez une réponse javascript du serveur, que lorsque vous avez un rechargement ou de navigation. Pour éviter d'intercepter vos autres sélections, vous devez également tout détruire avant de réinitialiser, le code serait quelque chose comme ceci:

$('.feed-content').html("<%= j(render 'form', feed_item: @feed_item) %>"); 
$(".select2").select2("destroy"); 
$(".select2").select2({ 
    theme: "bootstrap", 
    width: '100%', 
    allowClear: true 
});