Cambio de Color de una celda en un formulario

locooooo · #1 (**permalink**) 19/04/2013, 22:39

Estimados,

Primero que todo gracias por darse el tiempo para leer el post, lo que necesito es saber como puedo hacer para cambiar el color de fondo una celda que se encuentra dentro de un formulario dependiendo el valor que tenga el list asociado. Me explico si la persona elige el 1 debería colorearse la celda en tono rojo, el 2 amarillo y así hasta llegar a la opción 5. Además debo rescatar el valor de la variable para enviarla a la bd.

Gracias nuevamente

David · #2 (**permalink**) 19/04/2013, 23:00

Puedes usar el evento onchange del select para realizarlo, para cambiar el color solo necesitas cambiar la propiedad style.backgroundColor del elemento.

locooooo · #3 (**permalink**) 21/04/2013, 21:53

Estimado David,

Me podría mostrar un ejemplo de como hacerlo ya que no poseo los conocimiento para realizarlo yo mismo.

Muchas gracias por tú tiempo y respueta.

Saludos
Enzo

David · #4 (**permalink**) 21/04/2013, 22:02

Código HTML:

Ver original<!DOCTYPE html>
<html lang="es">
    <head>
        <title>Ejemplo</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            window.onload = function() {
                document.getElementById("colorselect").onchange = function() {
                    document.getElementById("parrafo").style.backgroundColor = this.value;
                }
            };
        </script>
    </head>
    <body>
        <h1>Color</h1>
        <form method="get">
            <div>
                <select name="color" id="colorselect">
                    <option value="#fff">Blanco</option>
                    <option value="#000">Negro</option>
                    <option value="#ff0000">Rojo</option>
                </select>
            </div>
            <p id="parrafo">
                Esto cambia de color
            </p>
    </body>
</html>