Tengo un control deslizante jQuery UI que forma parte de un sistema de calificación. Desliza a los valores 1 - 5 para calificarlo de 1 a 5. La configuración predeterminada es 3 cuando aparece el control deslizante por primera vez. La forma de la que forma parte tiene una entrada oculta cuyo valor debería ser el valor del control deslizante, pero no lo es.

Aquí está el jQuery:

$( "#ratingSlider" ).slider({
        range: "min",
        value: 3,
        min: 1,
        max: 5,
        slide: function( event, ui ) {
            $( "#ratingResult" ).val( ui.value );
        }
    });
    $( "#ratingResult" ).val( $( "#ratingSlider" ).slider( "value" ) );
    $("#ratingSlider").change(function(){
        $( "#rateToPost" ).attr('value', $( "#ratingSlider" ).slider( "value" ) );
    });

ntenté hacer que el .val () de #rateToPost sea el .val () del control deslizante, pero siempre solo le dio 3 (el valor predeterminado).

¿Cómo puedo hacer que pase el valor correctamente?

Además, quiero que el valor se actualice automáticamente (en este momento se muestra usando un cuadro de texto pero realmente no quiero usar un cuadro de texto) en la página cada vez que se mueve el control deslizante, ¿cómo puedo hacer eso?