Modificar el valor de flip alternar dinámicamente con jQuery Mobile

Question

estoy trabajando con jQuery Mobile, y guardar algunas configuraciones en una cookie. Cuando la página de configuración se vuelve a cargar, leo la cookie para establecer todos los valores. Estoy teniendo problemas para configurar la flip toggle switch. La mayoría de los elementos sólo tienen que activar los keyup o changed eventos, pero no estoy seguro de cómo las palancas flip toma su valor desde el cuadro de selección. ¿Algunas ideas?

Answer 1

creo que sólo se puede establecer el valor en el selecto como HTML normal y voltear el interruptor de palanca recogerá automáticamente. es decir,

<select name="slider" id="slider" data-role="slider"> 
    <option value="off">Off</option> 
    <option value="on" selected="selected">On</option> 
</select> 

Answer 2

Parece que está roto.

Ir a la página: http://jquerymobile.com/demos/1.0a2/#docs/forms/forms-switch.html y la consola de Firebug uso para ejecutar el siguiente:

$('#slider2').val('on').trigger('keyup'); 

Cambia el ancho de "en" parte del interruptor, pero no se mueve el deslizador.

Así que la respuesta es: esperar a que la liberación de JQM :)

Bug emitida aquí: https://github.com/jquery/jquery-mobile/issues/issue/676

Answer 3

Usando $('#slider2').val('on') va a cambiar el valor, ya que se supone que es. Sin embargo, no agrega las clases de CSS como ui-btn-active al option, ni elimina esa clase del option. Si desea cambiar dinámicamente el option, tendrá que encargarse de esas partes manualmente (no jQuery Mobile).

Answer 4

Después de cambiar el valor del interruptor hay que actualizarla para la animación para alternar:

$('#Switch2').val('on').slider("refresh"); 

Answer 5

Esto funciona para mí:

if (someCondition) { 
     $('#slider').val('off'); 
    } 
    else { 
     $('#slider').val('on'); 
    } 
    try { 
     $('#slider').slider("refresh"); 
    } 
    catch (err) { 
     console.log ("Error occurred refreshing slider (probabily first time!)"); 
    } 

Answer 6

Una forma sencilla de lograr esto es establecer el valor, desencadenar la creación y actualización. Después que necesita para activar el evento Slidestop para realizar cualquier acción que unido a la barra deslizante. por ejemplo:

$('#mySlider').val('on').trigger('create').slider("refresh"); 
$('#mySlider').trigger('slidestop'); 

He probado esto en jQuery mobile ver. 1.3.0