Cómo actualizar un control deslizante de la jQuery UI después de establecer los valores mínimo o máximo?

Tengo ui.slider y cambio sus valores mínimos y máximos en tiempo de ejecución. Pero estos cambios solo se reflejan en la vista, cuando también establezco los valores (lo que hace que active eventos que no son necesarios). En mi opinión, debería actualizar la vista después de establecer también min y max. ¿Hay una solución simple, parece que falta un método de actualización para el control deslizante.Cómo actualizar un control deslizante de la jQuery UI después de establecer los valores mínimo o máximo?

$("#something").slider({ 
    range: true, 
    values: [25, 75], 
    min: 0, 
    max: 100 
}); 
$("#something").slider("option", "min", 25); // left handle should be at the left end, but it doesn't move 
$("#something").slider("option", "values", [25, 75]); // the left handle is now at the left end, but doing this triggers events

Editar Este problema se ha solucionado en jQuery UI 1.9

Fuente

2011-06-13 Manuel Leuenberger

No sé si esto es un error en el control deslizante jQuery UI, pero de todos modos, lo que puede hacer es cambiar la corriente valor (técnicamente, establecer el valor actual en el valor actual ...) para forzar la actualización de la vista. Después de the documentation, esto significaría hacer algo como esto:

$(function() { 
    var $slide = $("#something").slider({ 
     range: true, 
     values: [25, 75], 
     min: 0, 
     max: 100 
    }); 
    $slide.slider("option", "min", 25); // left handle should be at the left end, but it doesn't move 
    $slide.slider("value", $slide.slider("value")); //force the view refresh, re-setting the current value 
});

Fuente

2011-06-13 18:52:58 tsimbalar

Este fue mi primer intento también, pero esto desencadenó el evento de cambio, etc. y, por lo tanto, no es tan estético como me gustaría que fuera;). Gracias de todos modos, parece que este es el camino a seguir si no quiero parchar el plugin deslizante. –

-3

que necesita para mantener una referencia a su objeto de control deslizante,

var slider = $("#something").slider({ 
       range: true, 
       values: [25, 75], 
       min: 0, 
       max: 100 
      }); 
slider.slider("option", "min", 25);

esto es todo enumeran en el Documentation

Fuente

2011-06-13 17:16:11 Andrew

No, no es necesaria una referencia. Establecer el mínimo funciona, PERO el estado visual del control deslizante no cambia. –

resuelto el problema de la manija de reposición ... acaba de llamar a esta función ..

function resetSlider(){ 
    $("#slider-fill").attr('value',maxPrice); 
    $("input[type='range']").slider("refresh");//refresh slider to max value 
    $(".ui-slider-handle").css("left","100%"); 
    console.log("Slider Reset Done."); 
}

Fuente

2012-04-09 07:27:50

Error no detectado: no hay tal método 'refresh' para la instancia del widget del control deslizante –

¡Asegúrese, estoy hablando de jQuery Mobile! –

probar esto.

valPercent = (current_slide_value - min_value)/(max_value - min_value) * 100;  
parentElem.find('.ui-slider-range').css('width', valPercent+'%');  
parentElem.find('.ui-slider-handle').css('left', valPercent+'%');

Fuente

2013-04-22 10:22:55 Anand

Podría ser un problema de versión pero no he probado nada con las opciones "min/max" trabajadas. Esto está bien y probado con JQuery UI 1.10. De esta manera usted puede utilizar el control deslizante o los números para cambiar el otro:

$("#mySlider").slider({range: true, min: 0, max: 100, values: [ 0, 100 ], step: 10, 
    slide: function(event, ui) { 
     $("#mySliderMin").val(ui.values[ 0 ]); 
     $("#mySliderMax").val(ui.values[ 1 ]); 
    } 
}); 
$("#mySliderMin").val($("#mySlider").slider("values", 0)); 
$("#mySliderMax").val($("#mySlider").slider("values", 1)); 
$("#mySliderMin, #mySliderMax").change(function() { 
    $("#mySlider").slider("values", 0, $("#mySliderMin").val()); 
    $("#mySlider").slider("values", 1, $("#mySliderMax").val()); 
});

Fuente

2014-02-25 23:50:13

Ajuste del valor mínimo deslizante como:

$slide.slider("option", "min", 25); no funciona para mí.

En su lugar usé: $slide.slider("values", "0", 25); y todo funciona bien.

Para ajustar el valor máximo control deslizante, utilice $slide.slider("values", "1", 75);

Para obtener más información sobre la configuración de los valores, consulte la documentación del API - http://api.jqueryui.com/slider/#option-values

Fuente

2014-08-12 06:29:25

gracias Trabajó para mí. – kplshrm7

Puede actualizar el div HTML en función de jQuery como

var d='<div class="row grid_slider"><div><p>Grid With time in 24 hour format</p><input type="text" class="range_time24" value="" name="range" /></div></div>';document.getElementById("slider").innerHTML=d;

después fijar los nuevos valores a la corredera

Fuente

2016-01-14 06:58:00

Por favor, intente esto:

$("#Slider2").slider("value", 10, 1000); //10 = min and 1000 = max

Fuente

2016-07-14 12:46:51

Cómo actualizar un control deslizante de la jQuery UI después de establecer los valores mínimo o máximo?

Respuesta

Cuestiones relacionadas