Error en contador de caracteres de campo de formulario

peachepe · #1 (**permalink**) 14/03/2007, 17:18

Holas!

Estuve haciendo un contador de caracteres de un campo de formulario, y que mostrara la cantidad de caracteres faltantes en un div o span.

El código es el siguiente:

contador.js:

Código:

function contador (maxim)
{
   this.maximo = maxim;
   this.div;
   this.campo;
   
   this.contar = function()
   {
	  this.div.innerText = maxim-obj.value.length;
	  if (this.campo.value.length==this.maximo)
	  {
	     return false;
	  }
	  else
	  {
	     return true;
	  }
   }
}

Después lo mando a llamar:

Código:

<script>
lugar = new contador(20);
lugar.campo = document.getElementById('lugar');
lugar.div = document.getElementById('lugardiv');
</script>

<p>
<input id="lugar" name="lugar" type="text" value="" onKeyPress="return lugar.contar();"> 
Disponibles: <span id="lugardiv">20</span>

Pero no funciona, y el browser solo me dice que el error está en:

Código:

<input id="lugar" name="lugar" type="text" value="" onKeyPress="return lugar.contar();">

Pero no logro identificar el error, ¿alguna sugerencia?

wigglyUtrera · #2 (**permalink**) 14/03/2007, 17:22

por lo que veo contar no es una funcion, es un boolean.

Asi que sobran los parentesis de:

onKeyPress="return lugar.contar();"

ponlo asi:

onKeyPress="return lugar.contar;">

Pruebalo y nos cuentas.

Saludos.

wigglyUtrera · #3 (**permalink**) 14/03/2007, 17:38

De la siguiente manera funciona:

Código PHP:

  function contador(maxim)

{

   this.maximo = maxim;

   this.div;

   this.campo;

   

   this.contar = function()

   {

      this.div.innerHTML = maxim-this.campo.value.length;

      if (this.campo.value.length==this.maximo)

      {

         return false;

      }

      else

      {

         return true;

      }

   }

}

ahora la inicialiazacion del objeto:

Código PHP:

  function pruebaCargar(){

lugar = new contador(20);

lugar.campo = document.getElementById('lugar');

lugar.div = document.getElementById('lugardiv');

}

ahora cargamos esta ultima funcion:

Código HTML:

<body onload="pruebaCargar()">

El resto de HTML lo dejas como lo tenias y te deberia de funcionar.

Saludos.

peachepe · #4 (**permalink**) 14/03/2007, 17:45

Cita:

Iniciado por wigglyUtrera

por lo que veo contar no es una funcion, es un boolean.

Asi que sobran los parentesis de:

onKeyPress="return lugar.contar();"

ponlo asi:

onKeyPress="return lugar.contar;">

Pruebalo y nos cuentas.

Saludos.

Sigue sin funcionar =(

wigglyUtrera · #5 (**permalink**) 14/03/2007, 17:48

Me acabo de dar cuenta que sólo funciona en Firefox. En IE no funciona, por lo menos en la version 7.

Si lo pones asi funciona en los dos:

Código PHP:

  function caracteres(tam,idtexto,iddiv){

var ret = false;

var campo =  document.getElementById(idtexto);

var div =  document.getElementById(iddiv);

div.innerHTML = tam-campo.value.length;

      if (campo.value.length==tam)

      {

         return false;

      }

      else

      {

         return true;

      }

}

y en el HTML

Código HTML:

<input id="lugar" name="lugar" type="text" value="" onKeyPress="return caracteres(20,'lugar','lugardiv');"> 
Disponibles: <span id="lugardiv">20</span>

La funcion esta puesta para que sea portable a otras situaciones. Si solo lo vas a utilizar en esa capa y con ese campo de texto, puedes quitarle los dos ultimos parametros y definirlos dentro de la funcion.

Saludos.

peachepe · #6 (**permalink**) 14/03/2007, 17:49

Cita:

Iniciado por wigglyUtrera

De la siguiente manera funciona:

....

El resto de HTML lo dejas como lo tenias y te deberia de funcionar.

Saludos.

Tampoco funcionó =(

Saludos.

wigglyUtrera · #7 (**permalink**) 14/03/2007, 17:53

La ultima funcion que te he puesto no pone el numero de caracteres que estan disponible si borras. Decrementa por cada caracter introducido pero no incrementa al introducir.

Saludos.

peachepe · #8 (**permalink**) 14/03/2007, 18:00

Ya resolví

Muchas Gracias!