How to refresh Select2 dropdown menu after ajax loading different content?

Como atualizar o menu suspenso Select2 após o carregamento de conteúdo diferente do Ajax?

Depois que o conteúdo é carregado via ajax você não pode mais atacar de forma genérica como, por exemplo, ‘select2’. Pois agora outros elementos possuem essa classe como o span gerado pelo select2.
Então você precisa após o carregamento do ajax chamar um método para verificar se o select2 já esta instanciado e instanciar individualmente.

Once the content is loaded via ajax you can no longer attack generically like eg ‘select2’. Because now other elements have this class as the span generated by select2.
So after loading ajax you need to call a method to check if select2 is already instantiated and instantiate it individually.

        jQuery('select.select2').each(function (i, obj) {
            if (!jQuery(obj).hasClass("select2-hidden-accessible")) {                
                jQuery(obj).select2();
            }
        });

Dessa forma deve funcionar.
That way it should work.

Links Úteis:
https://select2.org/programmatic-control/methods
https://stackoverflow.com/questions/17818210/how-to-refresh-select2-dropdown-menu-after-ajax-loading-different-content

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *