Javascript : Recorrer elementos de un formulario.

Marzo 10th, 2008 by kenavik

Función para recorrer los elementos de un formulario y sus propiedades con Javascript cliente.
Este es un simple ejemplo en el que podemos ver las propiedades NAME,TYPE y VALUE. (existen muchas más)
Para ello usaremos la colección elements que nos proporcionara todos los nodos del documento.
Usando la propiedad document.frm.elements.length podremos saber el número de items y así recorrer todos los elementos del documento HTML


<script>
function RecorrerForm(){
var sStr = "";
var frm=document.frm;
for (i=0;i<document.frm.elements.length;i++)
{
sAux += "NOMBRE: " + frm.elements[i].name;
sAux += “TIPO : ” + frm.elements[i].type;
sAux += “VALOR: ” + frm.elements[i].value + “\n” ;
}
alert(sStr);
}
</script>


<form name="frm">
<input type="text" value="" name="nombre"><br>
<input type="text" value="" name="apellidos"><br>
<input type="text" value="" name="telefono"><br>
<input type="text" value="" name="ciudad"><br>
<input type="text" value="" name="pais"><br>
<input type="submit" value="Aceptar" onclick="javascript:RecorrerForm();" >
</form>

Posiblemente este ejemplo no tenga mucha útilidad pero es una pequeña muestra de la potencia de javascript al recorrer la jerarquia de NODOS de un documento HTML.

Posted in Javascript | 5 Comments »

Javascript: Impedir la selección de texto en una página Web

Octubre 30th, 2007 by kenavik

Os dejo un fragmento de código Javascript con el que podemos impedir la selección de texto en una página Web.

Esta código funciona correctamente en Internet Explorer y FIREFOX

<script>
document.onselectstart=function(){return false};
if (window.sidebar){
document.onmousedown=function(e){
var obj=e.target;
if (obj.tagName==”INPUT”){
return true;
}else if (obj.tagName==”BUTTON”){
return true;
}
return false;
}
}
</script>

Posted in Javascript | No Comments »

Javascript: El objeto Screen

Octubre 11th, 2007 by kenavik

Este objeto de javascript almacena información acerca de la configuración de la pantalla del usuario.

El objeto screen suele contar con las siguientes propiedades

  • availHeight: Específicafica la altura de la pantalla (en píxeles) que pueden utilizar las ventanas
  • availWidth: La anchura de la pantalla (en pí­xeles) disponibles para utilizar con las ventanas.
  • colorDepth: El número de bit utilizado para representar colores por pantalla.
  • height: La altura de la pantalla de pí­xeles.
  • width: La anchura de la pantalla en pí­xeles.

Muy útil ya que permite programar un código más dinámico dependiendo de la configuración de la pantalla del usuario.

Posted in Javascript | 1 Comment »

Javascript: Permitir sólo números en Javascript

Junio 4th, 2007 by kenavik

Os dejo una función para evitar que nos introduzcan valores que son sean númericos en un campo HTML. Esta función funciona correctamente en Firefox e Internet Explorer.
Únicamente permitimos el punto para el separador decimal.

<script language=”javascript”>
var nav4 = window.Event ? true : false;
function IsNumber(evt){
// Backspace = 8, Enter = 13, ‘0′ = 48, ‘9′ = 57, ‘.’ = 46
var key = nav4 ? evt.which : evt.keyCode;
return (key <= 13 || (key >= 48 && key <= 57) || key == 46);
}

</script>

Usamos el evento onKeypress y así­ cada vez que el usuario pulsa una tecla comprobamos que el valor sea númerico.

<input type=”text” name=”telf” value=”" onkeypress=”return IsNumber(event);” >

Posted in Javascript | 7 Comments »

JAVASCRIPT : ¿Cuál es el mejor framework Ajax?

Diciembre 14th, 2006 by kenavik

Web 2.0

Ví­a barrapunto encuentro esta comparativa de frameworks de Ajax que han realizado los chicos de ajaxpatterns. Yo suelo usar siempre prototype ya que me resulta fácil de implementar y ya estoy acostumbrado a este framework pero bueno siempre va bien conocer nuevas librerias para implementar Web 2.0.

Documentación excelente sobre la libreria prototype- >> Using prototype
Os dejo el link para más info comparativa frameworks

Posted in Ajax, Javascript | No Comments »

Javascript: marcar o desmarcar un listado de checkbox’s con el mismo name

Diciembre 12th, 2006 by kenavik

Función muy útil cuando tenemos un listado de checkbox’s y queremos darle la opción al usuario de marcar o desmarcar todos a la vez sin tener que hacerlo manualmente. La siguiente función recorrer todos los checks con el mismo nombre y lo van marcando o desmarcando según si le hemos pasado un 1 o un 0. Entendemos como 1=true, 0=false.

Marcar o desmarcar todos los checkbox.

function check(action)
{
clientes=document.form2.IDcliente;
for (i=0;i<clientes.length;++i)
{
clientes[i].checked=action;
}
}

Esta función debe recibir un 1 o un 0 dependiendo de si queremos marcarlos todos o desmarcalos.

Posted in Javascript | No Comments »

Javascript: Recorrer checkbox’s con el mismo name

Diciembre 12th, 2006 by kenavik

Esta función de javascript recorrer los checks con el nombre “checkejemplo” y cuenta los que están checkeados. Para ello usamos la propiedad .length que nos indica el número de elementos con el mismo nombre y así podemos recorrerlos y comprobar su estado.
Finalmente mostramos el número de check’s activados con un alert. Muy útil si queremos validar una lista de checkbox’s de un formulario antes de realizar el submit y así obligar al usuario a seleccionar al menos uno. Este ejemplo es muy simple pero podemos implementarlo para casos más complicados.

function check()
{
checkejemplo=document.formu.checkejemplo;
cont=0;
for (i=0;i<checkejemplo.length;++i)
{
if (checkejemplo[i].checked)
{
cont++;
}
}
alert(cont);
}

En el formulario colocamos varios checkbox’s y los tres los llamamos “checkejemplo”.

Posted in Javascript | 3 Comments »

Javascript: Expresión regular para validar una dirección de correo.

Septiembre 1st, 2006 by kenavik

Aquí­ dejo una manera simple y sencilla de validar un email en javascript usando las potentes expresiones regulares.

function isEmail(email) {
var result = false; var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if (filter.test(email)) result= true;
return result;
}

Posted in Javascript | No Comments »