No te asustes
Este es el código que tenemos, dentro de él tenemos el código que se encarga de representar las pestañas (tabs), las ventanas emergentes (dialog) y slider.
Te ponemos todo porque creemos que cualquiera de lso componentes puede afectar.
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<LINK REL=StyleSheet HREF= "estilos/estilos.css" TYPE="text/css" MEDIA=screen>
<link type="text/css" href="jqueryTabs/css/start/jquery-ui-1.8.11.custom.css" rel="stylesheet" />
<link rel="stylesheet" href="jquerySlider/css/start/jquery-ui-1.8.11.custom.css">
<script src="jquerySlider/development-bundle/jquery-1.5.1.js"></script>
<script type="text/javascript" src="jqueryTabs/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="jqueryTabs/js/jquery-ui-1.8.11.custom.min.js"></script>
<script src="jqueryTabs/development-bundle/external/jquery.bgiframe-2.1.2.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.core.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.widget.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.mouse.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.button.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.draggable.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.position.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.resizable.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.ui.dialog.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.effects.core.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.effects.blind.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.effects.bounce.js"></script>
<script src="jqueryTabs/development-bundle/ui/jquery.effects.explode.js"></script>
<script src="jquerySlider/development-bundle/ui/jquery.ui.slider.js"></script>
<link rel="stylesheet" href="jquerySlider/development-bundle/demos.css">
<style>
#demo-frame > div.demo { padding: 10px !important; };
label, input { display:block; }
input.text { margin-bottom:12px; width:95%; padding: .4em; font-size: 15px; }
fieldset { padding:0; border:0; margin-top:25px; }
h1 { font-size: 1.2em; margin: .6em 0; }
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; }
</style>
<script type="text/javascript">
$(function(){
<%
if (nombres_palanca != null){
%>
//AQUI CREAMOS SLIDERS DE MANERA DINAMICA
var tam_ini = <%=rango_ini.size()%>
var tam_fin = <%=rango_fin.size()%>
var array_ini = new Array(tam_ini);
var array_fin = new Array(tam_fin);
var array_valores_game = new Array(tam_ini);
<%int l;
for(l=0; l< rango_ini.size(); l++){
%>
array_ini[<%=l%>]= "<%=rango_ini.elementAt(l)%>";
array_fin[<%=l%>]= "<%=rango_fin.elementAt(l)%>";
array_valores_game[<%=l%>]= "<%=valores_game.elementAt(l)%>";
<%
}
%>
var indiceTS = <%=indice_ts%>
var indeceFT = <%=indice_ft %>
var i=0;
for (i;i<<%=nombres_palanca.size()%>;i++){
if ((i != indiceTS) && (i != indeceFT)){
$( "#"+i+"-div" ).slider({
orientation: "horizontal",
range: "min",
min: array_ini[i],
max: array_fin[i],
value: array_valores_game[i],
step: 0.1,
slide: function( event, ui) {
var n = document.getElementById("slider").value;
$( "#"+n+"-input" ).val( ui.value );
}
});
$( "#"+i+"-input" ).val( $( "#"+i+"-div" ).slider( "value" ) );
}
}
<%
}
%>
// CREACIÓN DE LOS TABS
$('#tabs').tabs();
<%
if (indice_li != null){
%>
var n = <%=li%>;
$('#tabs').tabs("select", n);
<%
}
%>
$('#graficasSimulacion').tabs();
<%
if (indice_li_graficas != null){
%>
var m = <%=li_graficas%>;
$('#graficasSimulacion').tabs("select", m);
<%
}
%>
$( "#dialog:ui-dialog" ).dialog( "destroy" );
var login = $( "#login" ),
name = $( "#name" ),
apellido = $( "#apellido" ),
email = $( "#email" ),
clave = $( "#clave" ),
allFields = $( [] ).add( login ).add( name ).add( apellido ).add( email ).add( clave ),
tips = $( ".validateTips" );
var name2 = $( "#name2" ),
allFields = $( [] ).add( name2 ),
tips = $( ".validateTips" );
function updateTips( t ) {
tips
.text( t )
.addClass( "ui-state-highlight" );
setTimeout(function() {
tips.removeClass( "ui-state-highlight", 1500 );
}, 500 );
}
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 530,
width: 350,
modal: true,
buttons: {
"Modificar": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
bValid = bValid && checkLength( login, "Usuario", 1);
bValid = bValid && checkLength( name, "Nombre", 1);
bValid = bValid && checkLength( apellido, "Apellido", 1);
bValid = bValid && checkmail( email, "Email", 1);
bValid = bValid && checkNombre( login );
if ( bValid ) {
document.perfil.submit();
$( this ).dialog( "close" );
}
},
Cancelar: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#dialog-form2" ).dialog({
autoOpen: false,
height: 430,
width: 350,
modal: true,
buttons: {
"Guardar": function() {
var bValid = true;
allFields.removeClass( "ui-state-error" );
bValid = bValid && checkLength( name2, "Nombre", 1);
bValid = bValid && checkPartida( name2 );
if ( bValid ) {
document.guardar.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.guardar.submit();
$( this ).dialog( "close" );
}
},
Cancelar: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#dialog-form3" ).dialog({
autoOpen: false,
height: 430,
width: 350,
modal: true,
buttons: {
"Cargar": function() {
var i = 0;
var entro = false;
for (i;i<document.cargar.radio.length;i++){
entro = true;
if (document.cargar.radio[i].checked){
document.cargar.partida.value = i;
}
}
if (!entro){
document.cargar.partida.value = 0;
}
allFields.removeClass( "ui-state-error" );
document.cargar.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.cargar.submit();
$( this ).dialog( "close" );
},
Cancelar: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#dialog-form4" ).dialog({
autoOpen: false,
height: 430,
width: 350,
modal: true,
buttons: {
"Ver": function() {
var i = 0;
var entro = false;
for (i;i<document.ver.radio2.length;i++){
entro = true;
if (document.ver.radio2[i].checked){
document.ver.partida.value = i;
}
}
if (!entro){
document.ver.partida.value = 0;
}
allFields.removeClass( "ui-state-error" );
document.ver.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.ver.submit();
$( this ).dialog( "close" );
},
Cancelar: function() {
$( this ).dialog( "close" );
}
},
close: function() {
allFields.val( "" ).removeClass( "ui-state-error" );
}
});
$( "#opener" )
.button()
.click(function() {
$( "#dialog-form" ).dialog( "open" );
});
$( "#opener2" )
.button()
.click(function() {
$( "#dialog-form2" ).dialog( "open" );
});
$( "#openerCargar" )
.button()
.click(function() {
$( "#dialog-form3" ).dialog( "open" );
});
$( "#openerVer" )
.button()
.click(function() {
$( "#dialog-form4" ).dialog( "open" );
});
$( "#opener3" )
.button()
.click(function() {
document.guardar.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.guardar.submit();
return false;
});
$( "#opener4" )
.button()
.click(function() {
document.simulacion.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.simulacion.action = 'Controlador_volver_a_jugar';
document.simulacion.submit();
return false;
});
$( "#opener5" )
.button()
.click(function() {
document.simulacion.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.simulacion.boton.value = "simular";
document.simulacion.submit();
return false;
});
$( "#opener6" )
.button()
.click(function() {
document.simulacion.antiguo.value = "<%=datos_usuario.elementAt(0) %>";
document.simulacion.boton.value = "simular_todo";
document.simulacion.submit();
return false;
});
$("#tabs ul.tabs li:eq(1) a").addClass("activo").show();
});
</script>
<style type="text/css">
#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
ul#icons {margin: 0; padding: 0;}
ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;}
ul#icons span.ui-icon {float: left; margin: 0 4px;}
</style>
<script type="text/javascript">
