Mostrar formulario al seleccionar una opción en select
Publicado por yoclens (20 intervenciones) el 10/03/2024 21:38:10
Hola buenas, tengo un problema estoy tratando de mostrar un formulario por medio de un select este select se carga por medio de los registros de mi bd el problema es que al consultar por medio de console.log el valor seleccionado es vacío.
anexo códigos:
Select
Formulario
Función
anexo códigos:
Select
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div class="field">
<label class="label">Metodo de Pago</label>
<div class="control">
<div class="select">
<select id="metodoPago" name="id_metodo_pago" onchange="mostrarFormulario()">
<option value="" disabled selected>Seleccione Una Opción:</option>
<?php
$consulta = $DB_con->query("SELECT * FROM metodo_pago ORDER BY id_metodo_pago");
while ($linea = $consulta->fetch(PDO::FETCH_ASSOC)) {
?>
<option value="<?php echo $linea['id_metodo_pago'] ;?>"><?php echo $linea['metodo_pago'] ;?></option>
<?php
}?>
</select>
</div>
</div>
</div>
Formulario
1
2
3
4
5
6
7
8
9
<form id="formEfectivo" style="display: none;">
<label for="montoEfectivo">Monto en Efectivo:</label>
<input type="text" id="montoEfectivo">
</form>
<form id="formTransferencia" style="display: none;">
<label for="montoTransferencia">Monto en Transferencia:</label>
<input type="text" id="montoTransferencia">
</form>
Función
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script>
function mostrarFormulario() {
var metodoPago = document.getElementById("metodoPago");
var opcionSeleccionada = metodoPago.options[metodoPago.selectedIndex].value;
console.log("Opción seleccionada: " + opcionSeleccionada);
if (opcionSeleccionada === "1") {
document.getElementById("formEfectivo").style.display = "block";
document.getElementById("formTransferencia").style.display = "none";
} else if (opcionSeleccionada === "2") {
document.getElementById("formEfectivo").style.display = "none";
document.getElementById("formTransferencia").style.display = "block";
} }</script>
Valora esta pregunta
0
