1

Tenho o seguinte código.

Html:

<div>

<textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo1" value="Valor1"><span>Valor1</span>

<input type="radio" name="grupo1" value="Valor2"><span>Valor2</span>

<input type="radio" name="grupo1" value="Valor3"><span>Valor3</span>

<input type="radio" name="grupo1" value="Valor4"><span>Valor4</span>

<br><textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo2" value="Valor1"><span>Valor2</span>

<input type="radio" name="grupo2" value="Valor2"><span>Valor3</span>

<input type="radio" name="grupo2" value="Valor3"><span>Valor4</span>

<input type="radio" name="grupo2" value="Valor4"><span>Valor5</span><br>

<input type="button" value="Enviar" id="botao">

Javascript:

$(function () {


   $("#botao").click(function () {

 $("textarea[name='arraytextArea[]'],input[name='grupo1'],input[name='grupo2']" ).each(function (i,el) {


                    alert("Valor:"+$(el).val());


                });



            })})

Pode ver também no jsfiddle

Quero concatenar os elementos spans de cada grupo de radio. Como observado no código temos o primeiro grupo identificados pela teg name="grupo1",assim tenho de concatenar todos os spans que estão nesse grupo e em todos os outros grupos.Guardando cada concatenação de cada grupo em um indexe de vetor.

OBS: O código tem de servir pra inúmeros grupos e inúmeros rádios.

EX.:

vet[0]="valor1,valor2,valo3,valo4"; relativo ao name="grupo1"
vet[1]="Valor2,valor3,valor4,valor5"; relativo ao name="grupo2" 
2
  • Vc quer fazer isso ao clicar no botão?
    – Sam
    1/03/2018 às 1:09
  • sim!!!!!!!!!!!!
    – thiago
    1/03/2018 às 12:47

2 Respostas 2

2

Pode começar por agrupar os valores dos radios num objeto utilizando o nome do grupo como chave. Para simplificar pode adicionar diretamente o valor do <span> seguinte, resultando em algo como:

{
    grupo1: ["Valor1", "Valor2", "Valor3", "Valor4"],
    grupo2: ["Valor1", "Valor2", "Valor3", "Valor4"]
}

De seguida basta percorrer as chaves deste objeto e concatenar todos os elementos de cada array utilizando a função join com o separador apropriado, que seria a virgula.

Implementação:

let radios = {};
$("input[type=radio]").each(function(){ //para cada input do tipo radio
  let nome = $(this).attr("name");
  if (radios[nome] === undefined){ //se não existe esta chave no objeto
    radios[nome] = []; //cria com array vazio
  }
  
  radios[nome].push($(this).next().text()); //adiciona o texto do <span> ao lado
});

let valores = [];
for (let chave of Object.keys(radios)){
  valores.push(radios[chave].join(',')); //concatenar valores com ,
}

console.log(valores);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>

<textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo1" value="Valor1"><span>Valor1</span>

<input type="radio" name="grupo1" value="Valor2"><span>Valor2</span>

<input type="radio" name="grupo1" value="Valor3"><span>Valor3</span>

<input type="radio" name="grupo1" value="Valor4"><span>Valor4</span>

<br><textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo2" value="Valor1"><span>Valor2</span>

<input type="radio" name="grupo2" value="Valor2"><span>Valor3</span>

<input type="radio" name="grupo2" value="Valor3"><span>Valor4</span>

<input type="radio" name="grupo2" value="Valor4"><span>Valor5</span><br>

<input type="button" value="Enviar" id="botao">

1

Se for sempre nesse padrão <textarea> seguidos de input radio, pode fazer desta forma usando .nextUntil:

$(function () {

   let vet = [];

   $("#botao").click(function () {
      let textareas = $("textarea[name='arraytextArea[]']"),
      vals = '';
      textareas.each( (i,el) => {
   
         let radios = $(el).nextUntil("textarea", "input[type='radio']");
         radios.each( (i,el) => {
            vals += $(el).next().text()+' ';
         });
   
         vet.push(vals.trim().split(' '));
         vals = '';
   
      });
      console.log(vet);
   });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo1" value="Valor1"><span>Valor1</span>

<input type="radio" name="grupo1" value="Valor2"><span>Valor2</span>

<input type="radio" name="grupo1" value="Valor3"><span>Valor3</span>

<input type="radio" name="grupo1" value="Valor4"><span>Valor4</span>

<br>

<textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo2" value="Valor1"><span>Valor2</span>

<input type="radio" name="grupo2" value="Valor2"><span>Valor3</span>

<input type="radio" name="grupo2" value="Valor3"><span>Valor4</span>

<input type="radio" name="grupo2" value="Valor4"><span>Valor5</span>
<br>

<textarea name='arraytextArea[]'></textarea> <br>

<input type="radio" name="grupo3" value="Valor1"><span>Valor7</span>

<input type="radio" name="grupo3" value="Valor2"><span>Valor8</span>

<input type="radio" name="grupo3" value="Valor3"><span>Valor9</span>

<input type="radio" name="grupo3" value="Valor4"><span>Valor10</span>
<br>

<input type="button" value="Enviar" id="botao">

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 .