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!