1

Estoy tratando de mostrar el valor de un ítem seleccionado en un <select> en un <input type=text> o en un <label>, es decir, primeramente cargo el con la información que obtengo en una consulta realizada a la tabla de la base de datos:

<?php
   include("db.php");
   $con = conectar();
   $sql1 = mysqli_query($con,"SELECT COD_SERVICIO, DESCRIPCION_SERVICIO, COSTO_SERVICIO FROM servicios");

   $fechaAct = date("Y-m-d");
   $estado = "P";
?>
<select id="servicios" name="servicios">
  <?php
    while ($servicios = mysqli_fetch_array($sql1)) {
    ?>
    <option value="<?php echo $servicios['COD_SERVICIO'] ?>"><?php echo$servicios['DESCRIPCION_SERVICIO'] ?></option>
    <?php
    }
    ?>
</select>

y a parte como ya mencione al inicio quiero mostrar el COSTO_SERVICIO del ítem que se ha seleccionado; lo que voy a mostrar a continuación se que tiene errores y quiero aprender a darle solución

<label for="costo"><strong>Costo</strong>
                     <input type="text" name="costoServicio" value="<?php echo $sql1['COSTO_SERVICIO']?>"></td>

también he intentado cambiar de lugar el cierre de corchete } de la sentencia while del código php embebido en el html al después del input que contendrá dicho costo y se da un error ya que no se visualizan los elementos que tengo después, a continuación esta una captura de lo que obtengo visualmente:

introducir la descripción de la imagen aquí

¿Cómo puedo arreglar esta parte?

1 respuesta 1

0

Tendrías que usar Javascript y modificar un poco el HTML.
Javascript para responder a la selección de servicios y modificar el valor del campo input añadiéndole un atributo data-costo.

<select id="servicios" name="servicios" onchange="ponCosto()">
  <?php
    while ($servicios = mysqli_fetch_array($sql1)) {
    ?>
    <option value="<?php echo $servicios['COD_SERVICIO'] ?>" data-costoserv ="<?php echo $servicios['COSTO_SERVICIO'] ?>"><?php echo$servicios['DESCRIPCION_SERVICIO'] ?>  </option>
    }
    ?>
</select>

Ahora tienes activo el evento onchange y cada opción tiene un atributo data-costo con el costo del servicio.
En la función ponCosto() que se invoca cuando seleccionas una opción

function valor(){
    var ind = event.target.selectedIndex;  
    var valor = event.target.item(ind).dataset.costoserv;
    document.getElementById('costo').value = valor;
}

Lo primero que hace es anotar en ind el índice de la opción seleccionada. Lee el atributo data-costo del elemento option seleccinado. Por último anota el valor en el control input
Pon el script antes que el formulario para que onchange no te falle, y pon el valor inicial a input que se corresponda con el valor seleccionado. Puedes poner un primer campo option con valor "Seleccionar servicio " y data-costoser='', por ejemplo.

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.