Como hacer un menú desplegable de colores
Que tal experto como están espero que bien lo que quiero realiza es un formulario donde contenga un combobox (menú desplegable) que cuando selecciones un campo se ponga de un color establecido y que se guarde en mi base de datos al igual que me lo muestres
Tengo un pequeño formulario
index.php
Nombre
Apellido
Estado (aquí va el combobox)
-Aceptado (verde)
-Proceso (amarillo)
-Cerrado (rojo)
datos.php
nombre apellido estado
Oscar vazquez aceptado(color rojo)
Todo esto ya lo tengo conectado a mi base de datos y me lo guarda bien, solo quiero poner color en el select y que me muestre el valor y el color como le hago
1 Respuesta
Prueba con este código, para hacer lo de los colores en el formulario, he ocupado un poco de CSS y de javascript rustico.
<! DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Combo box con colores</title>
<style>
.defecto{
}
.Aceptado{
background-color: green;
}
.Proceso{
background-color: yellow;
}
.Cerrado{
background-color: red;
}
</style>
<script>
function colores(){
var color = document.getElementById("estado");
var estado = document.getElementById("estado").value;
if(estado=="Aceptado"){
color.className = "Aceptado";
}
if(estado=="Proceso"){
color.className = "Proceso";
}
if(estado=="Cerrado"){
color.className = "Cerrado";
}
}
</script>
</head>
<body>
<form action="">
<input type="text" name="nombre" id="nombre" placeholder="Nombre">
<input type="text" name="apellidos" id="apellidos" placeholder="Apellidos">
<select name="estado" id="estado" onChange="colores();" class="defecto">
<option value="">Elegir Estado</option>
<option value="Aceptado">Aceptado</option>
<option value="Proceso">Proceso</option>
<option value="Cerrado">Cerrado</option>
</select>
<input type="submit" value="Enviar">
</form>
</body>
</html>
Que tal experto muchas gracias por haberme contestado de verdad te comento ya hice tal cual como me lo plateaste si me lo pinta el color pero cuando en mi formulario le doy guardar, me muestra solo los datos el color no aparece en ese aspecto si me esta complicando mi formulario esta guardando en una base de datos
<td align="center"><?php echo $row["estado"]; ?></td>
aquí es donde me esta mostrando el valor del select pero solo me muestra el valor seleccionado
<?php
if($row['estado'] == "Aceptado"){
echo "<td align='center' class='Aceptado'>".$row['estado']."</td>";
}
if($row['estado'] == "Proceso"){
echo "<td align='center' class='Proceso'>".$row['estado']."</td>";
}
if($row['estado'] == "Cerrado"){
echo "<td align='center' class='Cerrado'>".$row['estado']."</td>";
}
?>Mediante una condición del valor que recoge el campo estado de la base de datos, se establece la celda y el color que va a tomar esa celda.
