Código
$('body').on('click', '#showChck input', function() { var $id = event.target.id; // ID DEL CHECKBOX $("#slider-" + $id).fadeToggle(); } else { // SI NO EXISTE SE CREA $('<div></div>', {id: "slider-" + $id, class: "slider", }), ); } });
Ya casi lo tengo! Jejeje
Edito: Me empané! El id del checkbox sera: checkbox-XX y solo necesito el numero...
Aunque realmente no me importa que el id del slider sea "slider-checkbox-XX". Mientras funcione me conformo
Edito2: Vale ya lo arreglé usando this.id
Ahora necesito saber como puedo inicializarlos, seguramente será justo despues de que se crean habra que añadirlo. Voy a probar.
Edito3: Si que funciona, pero encontre un problema:
Si hay un checkbox activado y mueves el primer slider el activado se desactiva pero el slider sigue visible, y al activarlo se oculta el slider (justo al reves de como debería funcionar).
Asi quedó el código:
Código
$('body').on('click', '#showChck input', function() { var x = this.id; var $id = x.replace(/\D/g, ''); $("#slider-" + $id).fadeToggle(); $("#result-" + $id).fadeToggle(); } else { $('<div/>', {id: "slider-" + $id, class: "slider"}), ); $("#slider-" + $id).slider({ min: 4, max: 100, value: 4, step: 2, slide: function( event, ui ) { } }); } });
Estoy intentando hacer pruebas a ver si consigo que si el checkbox esta desactivado pero el slider esta visible pues que al activarlo no se oculte por el toggle...