1

Tenho um problema no "como" mostrar os valores recebidos pelo evento de onClick no campo do checkbox, que estão armazenados em um array. Todo click em um checkbox armazena o id do mesmo no array.

Consigo mostrar todos os valores juntos ao passo que o usuário clica no checkbox usando o push, porem queria mostra-los em linhas separadas e o push não serviria nesse caso, tentei de algumas outras formas e continua sem o resultado desejável.

function disciplina_escolhida(){
        var disciplina = [];
        $('#disciplina :checked').each(function () {
        disciplina.push($(this).val());
        $('#listas').append('<div><input type="text" name="campo" value='+disciplina+' disabled style="cursor:pointer"></div>');
    });
}

O código até o momento é esse.

EDIT: Minha duvida é/era, como eu devo fazer para mostrar separadamente os valores que estão armazenados no array do CheckBox, pois, toda vez que alguem clica em um Checkbox, os valores/nomes já selecionados anteriormente, são somados juntos com o novo, fazendo com que todos os valores fiquem juntos em uma unica linha, a qual não era a intenção ao mostrar os dados do mesmo.

3
  • @LienFeng a sua pergunta está meia confusa, por gentileza leia as diretrizes da comunidade de como fazer uma boa pergunta. Assim que você fizer a alteração e explicar melhor a situação, dando exemplos, códigos entre outros os usuários e inclusive eu conseguirei te ajudar.
    – user148754
    13/05/2019 às 15:48
  • O push serve para você inserir elementos no array, não pra fazer exibições. Pode explicar melhor seu problema? 13/05/2019 às 15:49
  • Sim, sobre o push eu me expressei erroneamente, porem era "esse" mesmo o meu problema, já foi respondido mas tentarei editar e deixar de uma maneira mais sucinta.
    – LinFeng
    13/05/2019 às 15:57

1 Resposta 1

1

Use o primeiro parâmetro da função do .each para passar no valor da array disciplina. Esse primeiro parâmetro representa o índice do elemento no .each, mas antes esvazie a div com .empty() para não repetir os campos:

function disciplina_escolhida(){
   $('#listas').empty();
   var disciplina = [];
   $('#disciplina :checked').each(function (i) {
      disciplina.push($(this).val());
      $('#listas')
      .append('<div><input type="text" name="campo" value='+disciplina[i]+' disabled style="cursor:pointer"></div>');
   });
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Listas:
<div id="listas">
</div>
<div id="disciplina">
   <input type="checkbox" value="1">1
   <br>
   <input type="checkbox" value="2">2
   <br>
   <input type="checkbox" value="3">3
   <br>
   <input type="checkbox" value="4">4
</div>
<button onClick="disciplina_escolhida()">Adicionar</button>

3
  • eu não consegui entender a pergunta dele corretamente, se for isto mesmo o que ele quer eu te darei pontuação.
    – user148754
    13/05/2019 às 15:53
  • Era isso mesmo meu problema, quando novos valores eram adicionados após o clique no checkbox os mesmos sempre ficavam concatenados todos juntos, muito obrigado pela explicação e o código funcionou corretamente.
    – LinFeng
    13/05/2019 às 16:02
  • @THIAGODEBONIS valeu! Acho que era isso mesmo :D
    – Sam
    13/05/2019 às 16:12

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 .