Get the value of a li and create an input hidden with the value when the li is clicked

1

Good morning, gentlemen, I'm having a hard time taking action. I want it when clicked on the li, it adds in the div #form an input type hidden with the value of li. and that this happens only when you click once.

<div id="selecao">
  <input type="text" class="active" value="Conteudo 1" />
  <input type="text" class="active" value="Conteudo 2" />
  <input type="text" class="active" value="Conteudo 3" />
  <input type="text" class="active" value="Conteudo 4" />
  <input type="text" class="active" value="Conteudo 5" />
  <input type="text" class="active" value="Conteudo 6" />
  <input type="text" class="active" value="Conteudo 7" />
  <input type="text" class="active" value="Conteudo 8" />
  <input type="text" class="active" value="Conteudo 9" />
  <input type="text" class="active" value="Conteudo 10" />
  <input type="text" class="active" value="Conteudo 11" />
  <button class="btn" type="button">Show</button>
  <div id="form">

  </div>


</div>

The content of the dynamic li is generated by php, so the only thing that changes are the values, I tried to get all the fields of ul through the each () function but the problem is that the client may want to select other elements and then it does not upgrade directly.

I'm counting on your help and thank you in advance!

    
asked by anonymous 04.08.2015 / 16:22

1 answer

2

The idea is the same as my answer in your other question. You only have to assign the function to the event click() :

$("#selecao .active").click(function() {
    $('<input/>', {
        type: 'hidden',
        name: 'selecao[]',
        value: $(this).val()
    }).appendTo('#form');
});
    
04.08.2015 / 16:35