Plugin de calificación de estrella JQuery - deshabilitar después de envío de voto

Question

Estoy usando el plugin de calificación de estrellas JQuery (v2.61) de http://www.fyneworks.com/jquery/star-rating/. Todo va bien , pero me gustaría deshabilitar las estrellas cuando un usuario ha votado.

Actualmente mis usuarios seleccionan su clasificación y hacen clic con el mouse. Este actualiza mi base de datos a través de una llamada AJAX. El evaluador de estrellas cambia a para mostrar la selección del usuario, con las estrellas en rojo. Sin embargo, si el usuario coloca el mouse sobre las estrellas, todavía están activos y pueden enviar otro voto. Estoy deteniendo esta votación duplicada en el lado del servidor , pero desde el punto de vista de la usabilidad me gustaría que las estrellas se deshabiliten después del clic del usuario.

(supongo que podría recargar la div o algo con jQuery para mostrar una versión de sólo lectura de las estrellas, pero yo estaba esperando que había un poco más elegante y solución más simple).

Gracias.

Answer 1

Lo que realmente desea es revertir los elementos a los botones de opción, luego agregar solo y luego hacer que se vean bien de nuevo. Revertir no parece posible, pero podría desvincular todos los eventos en la publicación al servidor. $ ("..."). unbind();

Answer 2

Esto puede ser similar a su solución 'reload the div', pero creo que la mejor solución puede ser simplemente deshabilitar los elementos de entrada después de haber hecho su solicitud AJAX. Si está utilizando jQuery.ajax, puede especificar una función de devolución de llamada para ejecutar después de completar la solicitud.

jQuery.ajax({ 
    type: "POST", 
    url: ... 
    data: ... 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     jQuery('.star').attr('disabled', true); 
    }, 
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
     displayError(); 
    } 
}); 

Desde su página web:

utilizar la propiedad con discapacidad para utilizar un control únicamente para ser visualizados

<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/> 

Answer 3

¿Por qué no permitir que un usuario actualización su calificación ? Tal vez su primera calificación fue apresurada y les gustaría cambiarla, o pueden simplemente hacer clic en la estrella equivocada.

Por supuesto, necesitaría alguna manera de identificar a cada usuario, y un lugar para almacenar la clasificación de cada uno de los usuarios de cada elemento.

(En realidad, no sé cómo hacer nada de esto, pero desde el punto de vista de la usabilidad, parece un mejor enfoque que asegurarse de hacerlo bien la primera vez porque no puede cambiarlo después).

Answer 4

El problema se ha resuelto en la última versión del complemento. Ahora en la devolución de llamada puede hacer simplemente:

this.rating('disable'); 

Yey!

Answer 5

Soy el autor del plugin y acabo de lanzar (literalmente) una nueva versión (3.1) que debería ocuparse de los problemas que ha estado discutiendo aquí.

@ planetjones, tenga en cuenta que this.rating ('disable'); no es lo mismo que this.rating ('readOnly'); esto.rating ('readOnly') impedirá que el control cambie la selección actual, mientras que this.rating ('disable') evitará que el valor se envíe por completo.

@ svinto, el complemento utilizado para eliminar las cajas de radio, pero ahora las oculta. para revertir, todo lo que tiene que hacer es 1. eliminar las estrellas 2. mostrar las cajas de radio 3. eliminar los datos del complemento de las cajas de radio - $(). Datos ('calificación') y $ () .data ('rating.star') 4. desenlazar el evento 'cambio' de las cajas de radio

Por cierto, las actualizaciones serán anunciados aquí: http://twitter.com/fyneworks