Buenas! Estoy desesperado y agradecería un ratito de alguien que pueda echar una mano...Estoy creando una web, sin plantillas, en la que quiero agregar un botón personalizado que cuente clicks (los usuarios harían click si les gusta el objeto). Tenía un botón creado pero, claro, al actualizar la página, el contador volvía a estar a cero. Al investigar, he dado con un tutorial que parece bastante bueno, en el que se aclara que hay que crear una base de datos, archivos php, poner la url de uno de los archivos php en el script,y un largo etc al que no sé por dónde meterle mano. Este es el link:http://tutorialzine.com/2010/07/clic...ax-jquery-css/ puedo traducirlo sin problemas, pero no se llevarlo a cabo. He copiado y pegado mucho, pero no sé qué cambiar para que me sea útil en mi caso. gracias !
-
Compra una licencia de Windows 10/11 (10€) u Office (18€) al mejor precio u Office al mejor precio con CDKeyoffer. Entra en este post con las ofertas
Botón contador
- Autor huawei
- Fecha de inicio
Voy a intentar explicártelo un poco simple, la parte de código de html, javascript y css, son código cliente.
que significa, que se ejecuta en cliente y en el momento que el cliente cierra esa información se pierde, por lo que si quieres que se guarden los clicks o los me gusta o como quieras llamarlo, tienes que guardarlo en el servidor.
para ello, tienes varias formas, tener siempre cargados los objetos (barbaridad) o guardar los objetos en una base de datos y cada vez que los necesites acceder a la información.
Como ejemplo, te pongo una tienda y el mismo botón que tienes por cada prenda de ropa.
En la base de datos, tienes en la tabla de información de las prendas de ropa una columna mas que indique la cantidad de me gusta por ejemplo.
Cada vez que cargues en el cliente la pagina para mostrarle la prenda deberías hacer un select de esa prenda entera y con ella la cantidad de "me gusta".
Con ello ya tendrías el contador.
Como actualizar el contador si yo le doy a "me gusta".
en javascript hay una serie de funciones que lo que hacen es que envíes información al servidor y no recargue la pagina por completo, en mi caso uso ajax, haz una llamada a ajax enviándole el código de la prenda y cuando se reciba en el servidor que el sume 1 a los "me gusta" que tienes en la base de datos.
Esta tarde miro tu tutorial e intento hacer un ejemplo, pero no prometo nada que yo no manejo php.
que significa, que se ejecuta en cliente y en el momento que el cliente cierra esa información se pierde, por lo que si quieres que se guarden los clicks o los me gusta o como quieras llamarlo, tienes que guardarlo en el servidor.
para ello, tienes varias formas, tener siempre cargados los objetos (barbaridad) o guardar los objetos en una base de datos y cada vez que los necesites acceder a la información.
Como ejemplo, te pongo una tienda y el mismo botón que tienes por cada prenda de ropa.
En la base de datos, tienes en la tabla de información de las prendas de ropa una columna mas que indique la cantidad de me gusta por ejemplo.
Cada vez que cargues en el cliente la pagina para mostrarle la prenda deberías hacer un select de esa prenda entera y con ella la cantidad de "me gusta".
Con ello ya tendrías el contador.
Como actualizar el contador si yo le doy a "me gusta".
en javascript hay una serie de funciones que lo que hacen es que envíes información al servidor y no recargue la pagina por completo, en mi caso uso ajax, haz una llamada a ajax enviándole el código de la prenda y cuando se reciba en el servidor que el sume 1 a los "me gusta" que tienes en la base de datos.
Esta tarde miro tu tutorial e intento hacer un ejemplo, pero no prometo nada que yo no manejo php.
- Registrado
- 4 Jul 2012
- Mensajes
- 81.336
- Puntos
- 113
- Edad
- 36
Aquí tienes el link: http://tutorialzine.com/2010/07/click-to-appreciate-badge-ajax-jquery-css/
https://www.imaginanet.com/blog/usando-ajax-un-simple-ejemplo-con-php-y-jquery.html
Si analizamos el código que puedes ver.
En el button tienes un onclick, entiendo que eso lo manejas.
Aqui esta la chicha del boton:
--------------------------------
$.ajax({
data: parametros,
url: 'ejemplo_ajax_proceso.php',
type: 'post',
beforeSend: function () {
$("#resultado ").html("Procesando, espere por favor...");
},
success: function (response) {
$("#resultado ").html(response);
}
});
--------------------------------
El data son los parámetros que le envías a tu controlador, puedes ser como una estructura o como varias variables.
La Url es la dirección del controlador, tiene que tener el mismo formato que cuando haces un submit, en caso de php no se si tienes que poner la función a la que te dirijas, si en la clase solo hay una funcion no creo que sea necesario.
El Type tienes la opción por get o por post. Si no sabes la diferencia avisa y te la digo.
Y el beforeSend yo nunca lo use, pero puedes usarlo.
La gracia esta en el success, en este pones la funcionalidad del retorno, en este caso los datos que ponga traiga el response se introducirán en la etiqueta #resultado , que si vas al código esta en la linea 48.
Si devuelves un Integer, String o cualquier datos de tipo simple, se mete sin problemas.
Si devuelves una información compleja, como puede ser una lista lo que deberás hacer generar las diferentes etiquetas tu mismo.
Si analizamos el código que puedes ver.
En el button tienes un onclick, entiendo que eso lo manejas.
Aqui esta la chicha del boton:
--------------------------------
$.ajax({
data: parametros,
url: 'ejemplo_ajax_proceso.php',
type: 'post',
beforeSend: function () {
$("#resultado ").html("Procesando, espere por favor...");
},
success: function (response) {
$("#resultado ").html(response);
}
});
--------------------------------
El data son los parámetros que le envías a tu controlador, puedes ser como una estructura o como varias variables.
La Url es la dirección del controlador, tiene que tener el mismo formato que cuando haces un submit, en caso de php no se si tienes que poner la función a la que te dirijas, si en la clase solo hay una funcion no creo que sea necesario.
El Type tienes la opción por get o por post. Si no sabes la diferencia avisa y te la digo.
Y el beforeSend yo nunca lo use, pero puedes usarlo.
La gracia esta en el success, en este pones la funcionalidad del retorno, en este caso los datos que ponga traiga el response se introducirán en la etiqueta #resultado , que si vas al código esta en la linea 48.
Si devuelves un Integer, String o cualquier datos de tipo simple, se mete sin problemas.
Si devuelves una información compleja, como puede ser una lista lo que deberás hacer generar las diferentes etiquetas tu mismo.
creo que tu código es mas complejo que lo que tienes que hacer.
Ese botón lo que hace es llamar a la clase que haga falta y después desactiva y activa el botón cambiándole el val, muy lioso creo yo, y tu lo que quieres es el dato de vuelta o eso creo, porque no has explicado mucho (si entendí bien el código).
lo tuyo seria así.
$.ajax({
data: parametros,// ni necesitas
url: 'ejemplo_ajax_proceso.php',
type: 'get',
success: function (response) {
$("#button").val(response);
}
});
En este caso el php es una llamada a una función del controlador.
que veo que lo que quieres es que se te de la solución 100% para que no tengas que pensar, de esto hay mil ejemplo.
Ese botón lo que hace es llamar a la clase que haga falta y después desactiva y activa el botón cambiándole el val, muy lioso creo yo, y tu lo que quieres es el dato de vuelta o eso creo, porque no has explicado mucho (si entendí bien el código).
lo tuyo seria así.
$.ajax({
data: parametros,// ni necesitas
url: 'ejemplo_ajax_proceso.php',
type: 'get',
success: function (response) {
$("#button").val(response);
}
});
En este caso el php es una llamada a una función del controlador.
que veo que lo que quieres es que se te de la solución 100% para que no tengas que pensar, de esto hay mil ejemplo.