2

Estou fazendo uma pagina de cadastro de pedidos, onde pode-se cadastrar vários produtos.

Para cadastrar os produtos os usuários tem as opções de Produto, quantidade, valor, subtotal, caso queiram adicionar mais um produto, tem uma função que adiciona mais uma linha destes campos. campos do produto

O meu problema é que eu estou usando o Select2 para buscar os produtos no banco de dados, porém, o Select2 só funciona no primeiro campo de produto, se eu adicionar mais 1 produto, ele não funciona o Select2.

múltiplos produtos

Podem notar que os campos de produto possuem diferença, pois um esta com o Select2 e outro não.

O código JS que estou usando para essa busca é esse:

$( "#produto" ).select2({        
    ajax: {
        url: "modulos/orcamentos_funcao.php?buscar=produto",
        dataType: 'json',
        delay: 250,
        data: function (params) {
            return {
                q: params.term // search term
            };
        },
        processResults: function (data) {
            // parse the results into the format expected by Select2.
            // since we are using custom formatting functions we do not need to
            // alter the remote JSON data
            return {
                results: data
            };
        },
        cache: true
    },
    minimumInputLength: 1
});

Resumindo, preciso de uma busca dinâmica para os produtos.

2 Respostas 2

2

Tive um problema similar há muito tempo atrás. Na época, desisti de procurar, mas acredito que com o recurso "on" do jQuery você consiga reiniciar o select2 para elements adicionados dinamicamente.

Tenta adicionar o select2 "manualmente" dentro do clone do seu elemento.

1
  • pode dar 1 exemplo por favor?
    – Ricardo
    Commented 15/11/2019 às 11:13
1

Tive um problema igual a esse e encontrei uma solução funcional que quando você adicionar um novo item na lista que é quando buga o Select2, você "destroy" o Select2 e inicia novamente.

// inicia componente select
    $(".arrCentroCusto").select2({
        tags: true
    });

$(".adicionarCampo").click(function () { // clona a linha do select
        $('.arrCentroCusto').select2("destroy"); // destroi o select2 para não bugar
        novoCampo = $("tr.linhas:first").clone(); // clona a linha
        novoCampo.find("input").val(""); // tras a nova linha como null
        novoCampo.insertAfter("tr.linhas:last"); //bota a nova linha em baixo
        removeCampo(); 

        $('.arrCentroCusto').select2();//inicia o select2 novamente
    });

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .