Ya veo el problema. La cosa es que la comprobación deberías hacer en otro sitio.
Código Javascript
:
Ver original$(function() {
var root = $("#wizard").scrollable();
// creamos las dos variables que necesitaremos
var api = root.scrollable(), drawer = $("#drawer");
// parte logica usada en la validacion
api.onBeforeSeek(function(event, i) {
var $elegido =$("input[name=pi1]:checked");
if ($elegido.val()) {
alert("SELECCIONADO " +$elegido.val());
} else {
alert("NINGUN VALOR SELECCIONADO");
return false;
}
// recorremos toda la pagina
if (api.getIndex() < i) {
// en que pagina estamos
var page = root.find(".page").eq(api.getIndex()),
// buscamos los campos requeridos
inputs = page.find(".required :input").removeClass("error"),
// y comprobamos si estan vacios
empty = inputs.filter(function() {
return $(this).val().replace(/\s*/g, '') == '';
});
// si hay un campo vaco vamos a colorearlo
if (empty.length) {
drawer.slideDown(function() {
// coloreamos usando estilos jquery
drawer.css("backgroundColor", "#229");
setTimeout(function() { drawer.css("backgroundColor", "#fff"); }, 1000);
});
empty.addClass("error");
return false;
// si todo esta bien seguimos
} else {
// ocultamos la barra de aviso
drawer.slideUp();
}
}
// actulizamos la barra de estado
$("#status li").removeClass("active").eq(i).addClass("active");
});
// si persionamos siguiente nos vamos a pagina actual + 1
root.find("button.next").keydown(function(e) {
if (e.keyCode == 9) {
// ejecutamos la validacion logica
api.next();
e.preventDefault();
}
});
});
En la parte del onBeforeSeek