¿Cómo obtener el valor del elemento del menú desplegable y agregarlo a la entrada de texto?

Question

Quiero cambiar el valor de un cuadro de texto con el elemento que selecciono en un menú desplegable. Pero no está funcionando.

<input class="dropdown-toggle" type="text" name="area-zone" id="area-zone" 
data-toggle="dropdown">

<div class="dropdown-menu" role="menu" aria-labelledby="area-zone">
<a class="dropdown-item" href="#">Jway</a>
<a class="dropdown-item" href="#">Atrod</a>
</div>

Este es mi código jquery:

$('.dropdown-item').click(function (){
  $('#area-inout').val() = $('.dropdown-item').text();
})

¿Alguien puede ayudarme?

javascript jquery html

1

behi1989 17 oct. 2019 a las 15:46

Answer 1

Tratar :

$('.dropdown-menu .dropdown-item').on('click', function(){
   
    $("#area-zone").val($(this).text())
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
 

  
          <div class="dropdown">
           <input class="dropdown-toggle" type="text" name="area-zone" id="area-zone" 
            data-toggle="dropdown">
            <ul class="dropdown-menu">
                   <li><a class="dropdown-item" href="#">Jway</a></li>
                  <li><a class="dropdown-item" href="#">Atrod</a></li>

            </ul>
          </div>

0

becher henchiri 17 oct. 2019 a las 13:28

Answer 2

Cambie el nombre del menú desplegable con el nombre del cuadro de selección

<script>
    $('select[name="dorpdown_name"]').change(function() {
        $('#area-zone').val($(this).val());
    })
</script>

0

Mukesh Yadav 17 oct. 2019 a las 13:17

Answer 3

Prueba esto

$('.dropdown-menu .dropdown-item').on('click', function(){
   
    $("#area-zone").val($(this).text())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input class="dropdown-toggle" type="text" name="area-zone" id="area-zone" 
data-toggle="dropdown">

<div class="dropdown-menu" role="menu" aria-labelledby="area-zone">
<a class="dropdown-item d-area-input" href="#">Jway</a>
<a class="dropdown-item" href="#">Atrod</a>
</div>

0

Scott Marcus 17 oct. 2019 a las 12:57

Answer 4

¡Prueba esto!

$("div#dropDownSelect").click(function(e){
document.getElementById('inputBox').value = e.target.innerHTML;
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="inputBox" value="" class="dropdown-toggle" type="text" name="area-zone" id="area-zone" 
data-toggle="dropdown">

<div id="dropDownSelect" class="dropdown-menu" role="menu" aria-labelledby="area-zone">
  <a class="dropdown-item d-area-input" href="#">Jway</a>
  <a class="dropdown-item" href="#">Atrod</a>
</div>

0

Yahiya 17 oct. 2019 a las 13:02

¿Cómo obtener el valor del elemento del menú desplegable y agregarlo a la entrada de texto?

4 respuestas

Nuevas preguntas

javascript