Anteriormente postee un star rating sin base de datos para sistemas pequeños, pero para sistemas más grandes reocmiendo usar este plugin jquery.
Basado en el simple star rating plugin jquery lo he modificado para agregarle algunas características que le hacian falta como son: que el rating reciba la respuesta usando ajax y que además se pueda enviar como parámetro un id, esto es util para guardar el voto en una base de datos e identificar por que item estoy votando.
El código es muy simple de implementar, en el html pones:
Y para el código javascript:
1 2 3 4 5 | <script type="text/javascript"> $(document).ready(function() { $('#star1').rating('votar.php', {maxvalue: 5, curvalue:1, id:20}); }); </script> |
¿Qué significan esos parámetros?
- votar.php es el nombre del script que va a capturar el voto usando POST
- maxvalue: es la cantidad de estrellas
- curvalue: es el valor actual (opcional)
- id: es el identificador (opcional)
¿Cómo funciona?
El valor seleccionado y el id (si es que lo hemos definido) son enviados al script votar.php (o al que elijamos), en ese script podemos guardar el voto en una base de datos, los parametros son recibidos como $_POST[‘rating’] y $_POST[‘id’]
Si te pareció util este script, por favor dale una revisada a los googleads
///////// Actualizacion ////////
Este plugin no funcionaba en jquery 1.4.2 debido a la desaparición de la función .lt que ha sido substituida por .slice, eso ya esta corregido en el archivo zip
El script genera un error en IE. El error es de una propiedad no aceptada.
Ooops si se me pasó ese detalle, ya he arreglado el script, puedes volver a descargarlo y funciona en IE6
Gracias por el script!
Quería implementarlo en una encuesta, para esto, puse el div dentro de un formulario, pero necesito enviar todos los datos por POST una vez que el usuario presione el botón enviar. Se puede hacer esto?
Gracias!
PD: el captcha es ilegible!!
Este plugin no puedes usarlo para ponerlo dentro de un formulario, para eso deberias usar este otro http://www.miguelmanchego.com/2009/star-rating-jquery-sin-base-de-datos-1/ y obviar la segunda parte y usar tu propio codigo para capturar los datos (el valor de las estrellas es un campo hidden). Estoy buscando otro plugin de captcha pero ese aun con sus problemas es mas seguro.
Hola. Esta muy bueno el plugin. Yo quiero implementarlo en un carrito de compras para poder votar los distintos productos. El id de cada producto es diferente y en este ejemplo siempre se envia el mismo id. Hay alguna forma de que el valor del id tome el id de mi producto?
Gracias
Eso es facil de hacer imaginemos que la pagina de tu producto fuera http://miservidor.com/producto.php?id=23 donde la variable GET id sea el id de tu producto.
Tendrias que invocar el script asi: $(‘#star1’).rating(‘votar.php’, {maxvalue: 5, curvalue:1, id:=$_GET['id']?>});
de esa forma cambiaria el id segun el producto
Hola, muy intersanate el plugin, una consulta y si aparte de enviar el id , quisiera enviar un dato mas? gracias.
Si lo que quieres enviar es un formulario, mi respuesta es esta, si te refieres a enviar otras variables ademas del id, puedes ponerlas todas separadas por guiones $(’#star1′).rating(’votar.php’, {maxvalue: 5, curvalue:1, id:variable1+»-«+variable2″+….); y en el php que recoje los datos usando el comando explode($_POST[‘id’]), recuperas todas tus variables
Hola gracias x la respuestas, peor ahora envio un id y un usuairo y por ejemplo me sale con el explode 71145 (71 es id y 145 el usuario)se que con explode podria separarlo pero el problema que se me presenta es cuando este id aumentara de cifras(71,171,1711,etc…estoy tratando de enviarlo en el js con & pero me bota error, espero puedas despedejar mi duda.
Revisa con firebug que error indica javascript
Gracias ahora si me funcion con el explode como em indicaste, aca dejo la solucion kizas le pueda servir a alguien:
En el JS
$(\\\’#star1\\\’).rating(\\\’votar.php\\\’, {maxvalue: 5, curvalue:1, id: codigo+ \\\’ \\\’ +valor});
En el PHP
$video=$_POST[\\\’id\\\’];
$id= explode(\\
$video=$_POST[‘id’];
$id=explode(«_», $video);
$codUsuario=$id[0];
$codVideo=$id[1];
Aki toy otra vez, es ke no he parado de leer y leer…, es posible ver como trabaja este plugin?, actualmente blogger cuenta con uno que se puede usar, pero esta en ingles,
tambien hay un gidget que se puede introducir pero te lanza mucha publicidad, estoy hablando de: http://www.outbrain.com/get/ratings
La idea es poderlo incorporar ya sea en un gadget en la plantilla de blogger o al final de cada post para calificar el post por supuesto…
Grss:)
OOOppps, estoy cambiando de hosting y olvidé subir los botones, ahora puedes ver los links a las demos e incluso descargar el codigo fuente
Hola Miguel!
Te cuento que descargué este plugin, lo subí al directorio de mi web mediante FTP y luego de poner el codigo HTML » » en donde quiero que aparezca no aparece!
No sé que estoy haciendo mal, subí todos los archivos, incluso el index.html no se si abrá que editar algún archivo.
Espero que puedas ayudarme!
Felicidades por el blog, es la primera vez que lo visito. Muy interesante!
Un saludo.
Para hacer funcionar el plugin debes asegurarte que el ID del DIV sea el que invocas via javascript(mayusculas y minusculas), te recomendaría usar firebug para detectar algún error, sin más detalles dificilmente puedo aventurar una respuesta
Es que no entiendo mucho el Firebug… ¿Cuáles se suponen que son los errores? ¿Las líneas de código que están tachadas en el bloque de la derecha?
Un saludo!
En firebug hay una pestaña llamada consola alli se ven los errores con javascript, probablemnte debas activarla y recargar la página
Lo anterior ya lo solucione. Gracias.
Ahora tengo otra duda como se hace, para cuando un usuario ya voto no lo vuelva hacer.
Eso depende mucho de tu programación interna si son usuarios que se logean para votar en el archivo que procesa el voto deberias hacer una consulta SQL para ver si ya votó, si es sin login se verifica el IP o se crea una cookie lo cual no es tan seguro.
Lo que hago es lo siguiente, los usuarios registrados pueden votar, pero una vez que lo hicieron no se como bloquear las estrellas para que no tengan efecto (desde que carga la pagina o despues de votar). Por el momento lo he solucionado de esta forma que mande un mensaje diciendo que «ya voto» cuando intente volver a hacerlo.
Si esa es una forma de bloquear la otra es justo cuando cargue la pagina con PHP verificamos en la base de datos si ya votó simplemente ya no se imprime el DIV que contiene el star rating o colocamos un grafico con el acumulado de votos.
Muchas gracias por este script esta muy bueno,
yo tambien estoy viendo el como cargar otra cosa en el div si es que ya voto y no le vuelva a mostrar las estrellitas. podria incluirse como una opcion dentro de los parametros por ejemplo $(\’#star1\’).rating(\’votar.php\’, {maxvalue: 5, curvalue:1, id:20, maxvote:1});
y si es maxvote==1 que muestre la estrellas bloqueadas pero aun no entiendo muy bien todo el codigo del rating.js, algo como youtube
Para bloquear el voto prefiero colocar una condicion con PHP para que muestre un grafico con el promedio de la votación y ya no el DIV que contiene a las estrellas asi también se evita que algun usuario piense que no puede votar por un mal funcionamiento del script. Saludos desde Perú 🙂
Buenos dias, primero quiero darte las gracias por el script esta muy sencillo y es de gran utilidad.
estoy tratando de implementarlo en una pagina que a su vez utiliza mootools para generar un mapa de google. Aunque he utilizado el jQuery.noConflict(); y ortos metodos para viatar conflictos entre librerias, el script del rating no funciona y da error en rating.js linea 100 car 4. El error es de que el objeto no soporta el metodo.
Tienes alguna idea de que puede ser?
Un saludo
No es buena idea combinar frameworks porque al final terminarán dándonos dolores de cabeza, existen varias opciones para manejar googlemaps con jquery como por ejemplo este tutorial o este plugin
ta muy bueno esto.. solo en el js falta descomentar algunas lineas pa que muestre la respuesta del php…
ahora pa los que quieren que el mensaje del php se muestre no debajo de las estrellas sino al costado pueden agregarle en el css a .starRpta un float: right; y listo…
y como hago funcionar el boton de cancel rating… osea pa que me envie al php lo que tengo que restar en la db…
muy chevre y todo pero el script me saca algunos errores en fin lo modifique y listo ok pero tengo un inconveniente ahora con respecto a la version de jquery ya que en otro projecto utilizo jquery-1.4.2.min.js y estos causa incopatibilidad ya que utilizo un tab con esta version de jquery y alguna de las dos deja de funcionar, como hago para que este plugin funcine con la version de jquery-1.4.2.min.js y no jquery.js que creo que es la version del 2006 …. si algo me puedes hechar una mano… ya que me urge,..
Vuelve a descargarlo, lo he modificado para que funcione en 1.4.2
hola, el plugin anda muy bien, pero estoy tratando de hacer un sistema de votación para cada post de mi blog, cuando hay varios post en una sóla página puedo enviar bien los datos de cada uno por separado, pero cuando muestra la respuesta se muesta en todos, no sé si me hice entender bien, en odo caso alguna idea?
Ooops tienes razón había un pequeño bug en el plugin, vuelve a bajarlo ya esta corregido
Gracias, anda perfecto
Hola quisiera saber como usar esta libreria con cakephp porfa, ya que no m funciona
Fantástico, en firefox funciona ok, una pregunta, jquery tiene licencia MIT, pero todo tu ejemplo si lo adapto a mis necesidades puedo usarlo bajo que licencia?, saludos y gran trabajo
La licencia para los ejemplos es Creative Commons, aunque no esta demás escribir la fuente
Hola Miguel, he descargado el fichero y lo he probado pero me da un error
como saco el icono de cancelar o eliminar (el del signo menos)? gracias.
alguien sabe como poner en disable las estrellas… ya que luego de haber votado quiero que se desactive.
Hola, alguien me podría decir como puedo mostrar la votacion desde una base de datos?.
Estoy utilizando el plugin para una votación de jurados y quiero que la votación se pueda modificar. Cuando se entra a la pantalla de modificar, busco en la base de datos y si ya ha votado quiero que se vea la votación (que las estrellas se coloreen según los votos). Alguien sabe como se hace?
Gracias
Ya lo he averiguado, por si a alguien le interesa:
$(‘#star1’).rating(‘processVotaciones.php’, {maxvalue: 5, curvalue:, id:});
perdon:
$(\’#star1\’).rating(\’votar.php\’, {maxvalue: 5, curvalue:\, id:20, maxvote:1});
Creo que hay un error en rating.js:
en la linea 56:
var div = ‘‘+i+’‘;
debería ser:
var div = ‘‘+i+’‘;
Ya que así indica que vas a votar p.e. 5/10 o 8/10 y no 5/5 o 4/4.
Muy buen plugin!!!!
Gracias!
Hola, Excelente Aportacion!!!!
espero no incomodar con mi pregunta ya que soy algo nuevo en esto de PHP, JQUERY,
Pero de casualidad no podrás poner una pequeña descripción para conectar a la base de datos?,
Ya incorpore a mi sitio y funciona a la perfección, pero nada mas me falta conectarlo a la BD para conocer los resultados.
Muchas gracias y Quedo al pendiente.
¿alguien sabe por que no aparecen las estrellas en internet explorer 9?