Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Contador con cookies al hacer click en boton de formulario

JavaScript - Contador con cookies al hacer click en boton de formulario

Volver
Nuevo Tema
<<>>
 
Vista:

Contador con cookies al hacer click en boton de formulario

Publicado por sam (106 intervenciones) el 18/01/2016 13:35:38
Hola buenas;
Miren he conseguido hacer este codigo que funciona, hace que cuando hago click en el boton enviar de un formulario, me indica que se ha enviado dicho formulario, una, dos , tres... n veces.

Y como digo lo hace bien. pero lo que necesito y no se como hacer, es que haga lo mismo mediante una cookie.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<html>
 
    <form>
 
    <input bla bla bla />
 
    <input bla bla bla />
 
    <input type="submit" name="enviar" id="enviar" value="Enviar" />
 
    </form>
 
 
     <div id="intentos"></div>
 
</html>
 
 
 
<script>
    document.getElementById("enviar").onclick = contador;
 
 
        var i = 0;
 
        function contador()
 
            {
                i = i + 1;
 
                var mensaje_num_intentos = document.getElementById("enviar");
 
                mensaje_num_intentos = "Intento de Envíos del formulario " + i;
 
                document.getElementById("intentos").innerHTML = mensaje_num_intentos;
            }
</script>


Como digo tengo que hacerlo con una cookie, y lo unico que mi profesor me ha dado al explicarme el tema de cookies es esto:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
 
    function setCookie(name, value, expires, path, domain, secure) {
      document.cookie = name + "=" + escape(value) +
      ((expires == null) ? "" : "; expires=" + expires.toGMTString()) +
      ((path == null) ? "" : "; path=" + path) +
      ((domain == null) ? "" : "; domain=" + domain) +
      ((secure == null) ? "" : "; secure");
    }
 
 
    document.cookie="username=John Doe; expires=Thu, 18 Dec 2016 12:00:00 UTC; path=/";
 
    var x = document.cookie;
 
</script>

y con sinceridad no se como implementarlo para hacerlo, agradeceria cualquier ayuda, gracias de antemano.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Contador con cookies al hacer click en boton de formulario

Publicado por sam (106 intervenciones) el 18/01/2016 18:53:12
Vale, creo que he conseguido casi entenderlo pero para variar no me funciona y no se por que se que fallo en una tonteria pero no doy con la solucion, una ayudita lo agradeceria mucho la verdad:

Creo que el fallo esta en que no llamo bien al script con el boton del formulario pero no se como arreglarlo la verdad.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
<html>
 
    <form>
 
        <input bla bla bla />
 
        <input bla bla bla />
 
        <input type="submit" name="enviar" id="enviar" value="Enviar" />
 
        </form>
 
 
         <div id="intentos"></div>
 
</html>
 
 
 
<script>
 
    document.getElementById("enviar").onclick = setCookie;
 
 
	function setCookie(nombre, valor, expiracion, ruta, dominio, seguridad)
 
	{
		//DATOS DE LA COOKIE......................................................

		var datosCookie = nombre + "=" + valor +
		((expiracion) ? "; expiracion=" + expiracion.toGMTString() : "") +
		((ruta) ? "; ruta (path)=" + ruta : "") +
		((dominio) ? "; dominio" + dominio : "") +
		((seguridad) ? "; seguridad" : "");
 
 
		document.cookie = datosCookie;
	}
 
 
 
	function getCookie(nombre){
 
		var indice = nombre + "=";
 
		//Conseguimos el indice de (indice)

		var indiceInicioCookie = document.cookie.indexOf(indice);
 
 
		if (indiceInicioCookie == -1)
		{
			return null;
		}
 
 
 
		var indiceFinalCookie = document.cookie.indexOf(";", indiceInicioCookie + indice.length);
 
		if (indiceFinalCookie == -1)
 
		{
			indiceFinalCookie = document.cookie.length;
			return unescape(document.cookie.substring(indiceInicioCookie + indice.length, indiceFinalCookie));
		}
	}
 
 
 
	var visitas = getCookie("contador")
 
	if (!visitas)
	{
		visitas = 1;
	}
 
	else
 
	{
		visitas = parseInt(visitas) + 1;
		setCookie("contador", visitas);
 
		mensaje_num_intentos = "Esta es tu visita numero: " + visitas;
 
		document.getElementById("intentos").innerHTML = mensaje_num_intentos;
	}
 
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Vainas
Val: 95
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Contador con cookies al hacer click en boton de formulario

Publicado por Vainas (258 intervenciones) el 19/01/2016 10:35:28
Buenas:

Podrias dejar el codigo mas legible para que los demas podamos entenderlo. lo de poner input bla bla bla no ayuda mucho.

Yo creo que el fallo es en la asignacion al boton. Por ejemplo un boton espera una asignacion como la que has hecho:

1
document.getElementById("get").onclick = get;

Pero espera una funcion de este tipo:
1
2
3
4
function get(event){
...
return false:
}

lo del return false es porque estas dentro de un form y sino pones eso entonces se te refresca la pagina.

Esta parte:

1
2
3
4
5
if (indiceFinalCookie == -1)
{
    indiceFinalCookie = document.cookie.length;
    return unescape(document.cookie.substring(indiceInicioCookie + indice.length, indiceFinalCookie));
}

Yo la haria asi:

1
2
3
4
if(indiceFinalCookie == -1){
    indiceFinalCookie = document.cookie.length;
}
return unescape(document.cookie.substring(indiceInicioCookie + indice.length, indiceFinalCookie));

Ya que si no es -1 entonces no va a hacer el return

El resto parece que esta bien. Te dejo un ejemplo funcionando aqui: https://jsfiddle.net/sjwayons/

Si te fijas lo que he hecho es que he creado 2 funciones para obtener el click de los botones y ya dentro de ellos ejecuto las llamadas para obtener o fijar la cookie con los parametros que yo quiero o que puedo haber tomado de inputs de tipo text por ejemplo.

Espero que te sirva.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Contador con cookies al hacer click en boton de formulario

Publicado por sam (106 intervenciones) el 19/01/2016 12:53:29
Gracias, Vainas, por tu ayuda.

He entendido todos tus consejos respecto al codigo.

Pero me queda una cosa pendiente que no logro conseguir, veras.

El codigo funciona bien cuando el script esta por debajo del formulario pero necesito que el script este encima del formulario. osea entre las etiquetas <head>

Mi finalidad es que de esta manera (colocando el script al principio) , podria poner el script en un archivo js externo, y no en el mismo documento que es lo que mas necesito.

¿Abria alguna manera de conseguirlo sin poner nada de codigo javascript en el formulario, ?

gracias. :-)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Vainas
Val: 95
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Contador con cookies al hacer click en boton de formulario

Publicado por Vainas (258 intervenciones) el 19/01/2016 18:46:26
Buenas de nuevo:

El codigo siempre mejor abajo ya que asi carga primero los botones (el html en general) y luego el codigo, asi si hace referencia a algo en el html pues ya esta cargado en el navegador y no da problemas.

Aun asi si quieres cargar el codigo antes tienes varias opciones:

Usando jQuery que es una libreria de javascript tiene la funcion onready que es para que se ejecute el codigo una vez que se ha cargado el html independientemente de donde este tu codigo.

Por otro lado siempre se ha usado onload que es una funcion que viene con los navegadores (puede dar algun que otro problemas pero se puede usar). Su uso el del mismo modo que haces el onclick:

1
2
3
4
window.onload = function(e){
    document.getElementById("get").onclick = get;
    document.getElementById("set").onclick = set;
}

Yo creo que el resto de funciones no es necesario que esten dentro de onload ya que no se ejecutan hasta que no se carge las mismas dentro de onclick.

Puedes poner tus funciones y este codigo anterior en un documento aparte y referenciarlo al principio con:
1
<script src="nombre_de_tu_archivo.js"></script>

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar