Widget de calificación Star para jQuery UI

Question

Me presentaron el Star Rating widget para jQuery UI. Originalmente estaba usando this one.

¿Hay alguna diferencia entre usar los dos?

Bien tratando de usar el jquery UI, no puedo hacer que los botones de entrada aparezcan como estrellas. Tengo estos archivos JS y CSS incluidos:

<script src="jquery-1.3.2.min.js" type="text/javascript"></script> 
<script src="jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script> 
<script src="ui.stars.js" type="text/javascript"></script> 
<link href="ui.stars.css" type="text/css" rel="stylesheet" /> 

Y para mi código, simplemente:

<form> 
    Rating: <span id="stars-cap"></span> 
    <div id="stars-wrapper1"> 
     <input type="radio" name="newrate" value="1" title="Very poor" /> 
     <input type="radio" name="newrate" value="2" title="Poor" /> 
     <input type="radio" name="newrate" value="3" title="Not that bad" /> 
     <input type="radio" name="newrate" value="4" title="Fair" /> 
     <input type="radio" name="newrate" value="5" title="Average" checked="checked" /> 
     <input type="radio" name="newrate" value="6" title="Almost good" /> 
     <input type="radio" name="newrate" value="7" title="Good" /> 
     <input type="radio" name="newrate" value="8" title="Very good" /> 
     <input type="radio" name="newrate" value="9" title="Excellent" /> 
     <input type="radio" name="newrate" value="10" title="Perfect" /> 
    </div> 
</form> 

Todos los archivos y las imágenes están en la misma carpeta. Nunca utilicé la interfaz de usuario de jquery, por lo que no estoy seguro de que todo lo que necesito es ese archivo. No estoy seguro si lo necesita tampoco, el otro plugin de calificación de estrellas que estaba usando no lo requería. Alguien sabe lo que me falta algo?

Answer 1

generalmente los archivos jquery ui css hacen referencia a imágenes de la carpeta llamada images put es el mismo directorio que el archivo css. Por lo tanto, debe cambiar la ruta de las imágenes referidas en ui.stars.js.

| 
    --images 
    | 
    ---image files are here 
    | 
    --ui.stars.css 

Answer 2

Al utilizar orkans' STAR_RATING que necesita para indicarle que debe convertir a radiobuttons estrellas explícitamente, como este (utilizo el modo jQuery.noConflict):

jQuery(document).ready(function($){ 
    $("#stars-wrapper1").stars(); 
} 

Answer 3

me enteré, ese problema con la La versión que he descargado es que ese objeto o no está bien inicializado en la función _init (los valores predeterminados desde el final de ui.star.js no están cargados). Este objeto también establece los valores de CSS (clases). No he encontrado la solución todavía, pero una solución sencilla sería, para llenar esos valores en la inicialización de las estrellas en su página:

<script type="text/javascript"> 
    $("#stars-wrapper1").stars({ 
    cancelClass: "ui-stars-cancel", 
    starClass: "ui-stars-star", 
    starOnClass: "ui-stars-star-on", 
    starHoverClass: "ui-stars-star-hover", 
    starDisabledClass: "ui-stars-star-disabled", 
    cancelHoverClass: "ui-stars-cancel-hover", 
    cancelDisabledClass: "ui-stars-cancel-disabled" 
    }); 
    </script>