0

Resulta que cuando despliego el dropdown y selecciono una de las opciones el botón no cambia.

Me refiero a que tengo un imput-group con dos casillas de texto y un dropdown. En el "placeholder" del boton "dropdown" (el que se despliega en cascada) dice "Tipo" y esperaría que al desplegarlo y seleccionar alguna de las opciones dadas (Entrada y Salida) el "placeholder" del boton cambiara de "Tipo" a "Entrada" o "Salida" dependiendo de lo que el usuario escoja.

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Abacus</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<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.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

<div class="input-group">
  <input #toFocus [(ngModel)]="concepto" placeholder="concepto" type="text" class="form-control" type="text" class="form-control" aria-label="Text input with dropdown button">
  <input [(ngModel)]="valor" type="text" placeholder="monto" class="form-control"(keypress)="enter($event.keyCode, toFocus)" type="text" class="form-control" aria-label="Text input with dropdown button">
  <div class="input-group-append">
    <option class="btn btn-outline-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      Tipo
    </option>
    <div class="dropdown-menu">
      <a class="dropdown-item" href="#" (click)="tipoDeMovimiento('entrada')">Entrada</a>
      <a class="dropdown-item" href="#" (click)="tipoDeMovimiento('salida')">Salida</a>
    </div>
  </div>
</div>
<div>
  <button class="btn btn-outline-dark mt-2" (click)="crear()" >Agregar</button>
</div>
</body>
</html>

Aqui dejo el codigo que estoy usando actualmente.

Tipo Entrada Salida Agregar

Mil gracias!!!

3
  • 2
    Mira Cómo preguntar <-ACA para que tu pregunta sea mejor recibida. Tambien, aprovecha y haz el recorrido de bienvenida <-ACA para entender mejor como funcionamos y de paso obtener tu primera medalla! deberias agregar a tu pregunta una forma de reproducir tu problema, si no es imposible ayudarte. usa el boton editar y agrega el codigo que te trae problemas
    – gbianchi
    Commented el 1 ago. 2018 a las 17:14
  • 1
    Como @gbianchi te inidica, necesitamos más informacion para poder ayudarte. muestranos la parte del código que es relevante para la pregunta y qué cosas has intentado.
    – Nery Ortez
    Commented el 1 ago. 2018 a las 17:46
  • No se como mas exponer mi dificultad. Quizás las pocas horas que tengo de experiencia no me están ayudando.
    – Govox
    Commented el 2 ago. 2018 a las 14:02

1 respuesta 1

0

Usa un option como place holder:

<option value="" disabled selected>Selecciona Rol</option>

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.