O resultado que preciso atingir usando o jQuery UI Slider parece ser simples. O Slider será utilizado para definir a idade do usuário que submeteria o formulário, com valor mínimo de 18 (anos) e máximo 100 (anos)... O objetivo pretendido pode ser dividido em duas partes:
Primeira parte > Mostrar o valor do Slider em um input de texto:
Até aqui, eu consigo que a primeira parte do objetivo funcione normalmente com o seguinte código. O resultado pode ser visto aqui no jsfiddle.
jQuery(document).ready(function($) {
$("#slider-idade").slider({
range: "min",
value: 18,
min: 18,
max: 100,
step: 1,
animate: 200,
slide: function(event, ui) {
$("#valor-idade").val(ui.value);
}
});
$("#valor-idade").val($("#slider-idade").slider("value"));
});
Segunda parte > Atualizar o Slider caso o usuário insira um valor no input de texto:
------//------
Tentei seguir algumas instruções e soluções postadas no stackoverflow em inglês, tal como podemos ver nesse stack aqui https://stackoverflow.com/a/7524385/1152876, contudo, não estou conseguindo implementar as soluções propostas na discussão.
*Apenas para constar, caso haja alguma interferência: No site que estou implementando o Slider, estou utilizando também o jQuery UI Touch Punch https://github.com/furf/jquery-ui-touch-punch#readme para adicionar suporte a eventos Touch à biblioteca do jQuery UI quando usada em dispositivos móveis, já que por padrão a biblioteca jquery-ui não funciona.