1

Estimados

Estoy tratando de pasar un valor de un input que se carga de un modal, y quiero que se muestre automáticamente en otro input. yo he podido hacerlo con las siguientes funciones

keyup() : Esta función solo me muestra a medida que yo escribo en el primer input , se va mostrando en otro input.

keyPress() : Esta función me muestra solo si presiono un tecla sobre el primer input para que se muestre ese valor en el otro input.

Change() : Esta función se comporta parecido a la keup().

Lo que yo hago es seleccionar un modal desde una vista y ese modal me permite seleccionar un registro y presionar un botón que cierra el modal y envía un valor al primer input de la vista y ese valor es el que yo quiero que se replique en el otro input pero de manera automática , es decir al mostrarse ese valor en el primer input , se debe mostrar en el segundo input.

Aquí las imágenes

introducir la descripción de la imagen aquí

introducir la descripción de la imagen aquí

ahora el input de mas abajo es donde yo quiero que se muestre automáticamente el valor que llega al primer input.

introducir la descripción de la imagen aquí

para eso utilizo esta función, pero he utilizado keyPress() , KeyUp() , change() y no funciona como necesito.

<script>
  $(document).ready(function () {
      $("#txt_mostrar_nombre_estacion").keypress(function () {
          var value = $(this).val();
          $("#txt_mostrar_origen_vuelos").val(value);
      });
  });
</script>

Por favor si me pudieran orientar para poder realizar lo que necesito se los agradecería.

2
  • Hola Simón, nos enseñas muchas imagenes, pero necesitamos ver tu cogido HTML para poder guiarte. Commented el 23 mar. 2019 a las 15:23
  • que version de bootstrap estas usando ? Commented el 23 mar. 2019 a las 15:27

1 respuesta 1

1

Saludos podrias hacerlo asi:

function copiarValor(data){
  //agregar valor copiado
	$("#valorCopiado").val(data);
  //ocultar modal
	$("#exampleModal").modal('hide');
}//copiarValor
<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
  
  <!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
Consultar
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Consultar</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <table class="table">
          <tr>
            <td>NOMBRE</td>
            <TD>DIRECCION</TD>
            <td>Accion</td>
          </tr>
          <tr>
            <td>Cristina Paredes</td>
            <td>Av Juarez</td>
            <td>
              <a href="#" onclick="copiarValor('Cristina Paredes');">
              CoPiAr VaLoR
              </a>
            </td>
          </tr>
          <tr>
            <td>Fernanda Ortega</td>
            <td>Av Mayor</td>
            <td>
              <a href="#" onclick="copiarValor('Fernanda Ortega');">
              CoPiAr VaLoR
              </a>
            </td>
          </tr>
        </table>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Salir</button>
      </div>
    </div>
  </div>
</div>
  
<input type="text" name="valorCopiado" id="valorCopiado" class="form-control" placeholder="valor copiado">

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  </body>
</html>

Si te fijas uso el evento onclick el cual llama a una funcion JavaScript y por los respectivos "ID" agrego el valor copiado y a su vez oculto la modal.

Espero te sirva..!!

2
  • Hola amigo, la verdad eso lo tengo hecho el tema es que son 2 input en la vista principal (input "Guía" e input "Vuelo", y al abrir el modal , se captura un dato y lo envía al input "Guía" de la vista principal y quiero que ese valor se copie también en el input "Vuelo", eso es básicamente lo que necesito. igual gracias amigo Commented el 23 mar. 2019 a las 23:26
  • Buenos días, he intentado de varias maneras pero aun no he logrado hacer los que necesito . alguien me podrían ayudar con este tema por favor. Commented el 26 mar. 2019 a las 17:16

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.