validacion de formulario

[juan_14nob]

Problemas en funciones y variables javascript. Les explico mi problema, estoy realizando una validacion javascript, estoy utilizando ajax.. lo que quiero hacer es un formulario de mensaje que envie y si un campo esta vacio o no cumple con las condiciones que se ponga el campo el borde de color rojo..el panel de firebug me dice este error:


Elemento referenciado por ID/NAME en el ámbito global. Use el estándar del W3C document.getElementById() en su lugar.
[Interrumpir en este error] var nombre=eliminaEspacios(form.nombre.value);

Elemento referenciado por ID/NAME en el ámbito global. Use el estándar del W3C document.getElementById() en su lugar.
[Interrumpir en este error] var email=eliminaEspacios(form.email.value);

Elemento referenciado por ID/NAME en el ámbito global. Use el estándar del W3C document.getElementById() en su lugar.
[Interrumpir en este error] var mensaje=eliminaEspacios(form.mensaje.value);

lo estoy haciendo de esta manera:

Código Javascript:

<script type="text/javascript">
onLoad=function(){
    clasenormal="inputnormal";
    claseError="inputError";
 
 
}
function limpiaForm()
{
    for(i=0; i<=4; i++)
    {
        form.element[i].className=claseNormal;
    }
    document.getElementById("nombre").className=claseNormal;
}
function campoError(campo)
{
    campo.className=claseError;
    error=1;
}
function eliminaEspacios(cadena)
{
    // Funcion para eliminar espacios delante y detras de cada cadena
    while(cadena.charAt(cadena.length-1)==" ") cadena=cadena.substr(0, cadena.length-1);
    while(cadena.charAt(0)==" ") cadena=cadena.substr(1, cadena.length-1);
    return cadena;
}
 
function validaForm()
{
    //limpiaForm();
    error=0;
 
    var nombre=eliminaEspacios(form.nombre.value);
    var email=eliminaEspacios(form.email.value);
    var mensaje=eliminaEspacios(form.mensaje.value);
 
    
    if(!validaLongitud(nombre, 1, 4, 50)) campoError(nombre);
    if(!validaLongitud(email, 1, 4, 50)) campoError(email);
    if(!validaLongitud(mensaje, 1, 4, 50)) campoError(mensaje);
 
    
    }
    
    function validaLongitud(valor, permiteVacio, minimo, maximo)
{
    var cantCar=valor.length;
    if(valor=="")
    {
        if(permiteVacio) return true;
        else return false;
    }
    else
    {
        if(cantCar>=minimo && cantCar<=maximo) return true;
        else return false;
    }
}
 

Código HTML:

<table >
        <form id="form" class="formuclaefwfew" method="POST" action="contac.php">
        <tr>
            <td class="tables">Nombre: </td>
            <td><input type="text" class="inputnormal" size="22" id="nombre"> </td>
        </tr>
        <tr>    
            <td class="tables">E-mail: </td>
            <td><input type="text" class="inputnormal" size="22" id="email" > </td>
            
        </tr>       
        <tr>
            <td class="tables">Comentario: </td>
            <td><textarea class="inputnormal" id="mensaje"></textarea><br/> </td>
        </tr>   
            
        </table>
            <input class="but" type="button" value="Enviar" onclick="validaForm();"></td>
            
            <input class="but" type="reset" value="Borrar" ></td>
            
        </form>
 

[maycolalvarez]

no todos los navegadores encuentran una referencia directa entre el id/name del form declarado en el HTML y el js, es por ello que siempre debe se usarse funciones del DOM:

document.getElementById('form') //en el caso de ID

o colecciones si se declaran con el atributo NAME:

document.forms['name_form'].elements['name_input']

[juan_14nob]

Iniciado por maycolalvarez

no todos los navegadores encuentran una referencia directa entre el id/name del form declarado en el HTML y el js, es por ello que siempre debe se usarse funciones del DOM:

document.getElementById('form') //en el caso de ID

o colecciones si se declaran con el atributo NAME:

document.forms['name_form'].elements['name_input']

Hola, antes de todo queria darte las gracias por orientarme pero no consigo hacer lo que quiero, ya que hice lo que tu me dijiste y lo hice de esta manera:

Código Javascript:

var nombre = document.getElementById(nombre);
    var email = document.getElementById(email);
    var mensaje = document.getElementById(mensaje);
document.write(nombre);
 

y luego hago document.write(nombre); para ver si llega el valor de la variable del formulario, pero aparece 'null' quiere decir que no llega nada del formulario (obviamente complete el campo nombre para la prueba)


saludos y espero que logren ayuadarme

[maycolalvarez]

var nombre = document.getElementById('te olvidaste de las comillas');

docment.write() afecta el flujo del HTML, si lo que quieres es afectar un input usa su atributo value

[juan_14nob]

Iniciado por maycolalvarez

var nombre = document.getElementById('te olvidaste de las comillas');

docment.write() afecta el flujo del HTML, si lo que quieres es afectar un input usa su atributo value

Hola si, me puse a revisar el codigo y lo corregi pero sigo sin poder hacer lo que quiero, en el transcurso de la validacion, cuando el script detecte el error quiero que la clase del input (osea 'inputnormal') cambie a ( 'inputError' ) ya que la clase inputError es la que contiene el borde en rojo, entiendes? Al corregir las comillas y agregarle el .value a las variables firebug no ha detectado ningun error pero tampoco hace lo que quiero que haga

[maycolalvarez]

postea el código completo, así es más facil ayudarte

veo que aquí tratas como de declarar variables globales, pero usando el evento onload ¿de quien?:

Código Javascript:

onLoad=function(){
    clasenormal="inputnormal";
    claseError="inputError";
}
 

para declarar variables globales, simplemente colocarlas fuera de cualquier función, en ámbito global:

y no te olvides de usar var

Código Javascript:

var clasenormal="inputnormal";
var claseError="inputError";
 

así, dichas variables serán accesibles desde cualquier función en js