fill in input text based on a list selection

-1

I need that if I select item 1, the text "Element 1" is added to the input # search, I hope for your wisdom, thank you very much in advance:)

   

  var esteLi = $(".datss").html();
  $("#busqueda").val(esteLi);
   
<input id="busqueda" class="miclase" type="text">
<div id="resultado">
<ul id="listas">
<li class="datss">Elemento 1</li>
<li class="datss">Elemento 2</li>
<li class="datss">Elemento 3</li>
<li class="datss">Elemento 4</li>
<li class="datss">Elemento 5</li>
<li class="datss">Elemento 6</li>
</ul>
</div>
    
asked by Marco Torres 19.02.2018 в 19:30
source

3 answers

0

is a super-fast answer:

<script type="text/javascript">
 $('.datss').on('click', function(){
    var txtToAppend = $('#busqueda').val() +  $(this).text() + ' - ';
    $('#busqueda').val(txtToAppend);
 });</script>
    
answered by 19.02.2018 / 21:00
source
0

I hope this simple example will help you.

$('.datss').click(function() {
  var esteLi = $(this).text();
  $('#busqueda').val(esteLi);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="busqueda" class="miclase" type="text">
<div id="resultado">
  <ul id="listas">
    <li class="datss">Elemento 1</li>
    <li class="datss">Elemento 2</li>
    <li class="datss">Elemento 3</li>
    <li class="datss">Elemento 4</li>
    <li class="datss">Elemento 5</li>
    <li class="datss">Elemento 6</li>
  </ul>
</div>
    
answered by 19.02.2018 в 21:09
0

Hi, I do it this way with jquery

$('#listas').on('click','li',function(e){		
  $('#busqueda').val($(this).text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="busqueda" class="miclase" type="text">
<div id="resultado">
<ul id="listas">
<li id="ele-1">Elemento 1</li>
<li id="ele-2">Elemento 2</li>
<li id="ele-3">Elemento 3</li>
</ul>
</div>
    
answered by 19.02.2018 в 21:11