Thanks,
was solved using: onclick="$('#id_tab').load('url_to_page');"
My complete code of the tans page:
{{extend 'layout.html'}}
<script>
$(function() {
$("#tabs").tabs();
$("#tabs1").tabs();
$("#tabs2").tabs();
});
</script>
<div id="tabs">
<ul>
<li><a href="#tabs-1">{{=T('Nomina').capitalize()}}</a></li>
<li><a href="#tabs-2">{{=T('Unidad Ejecutora').capitalize()}}</a></li>
</ul>
<div id="tabs-1">
<div id="tabs1">
<ul>
<li><a id="t_tabs1-1" href="#tabs1-1">Agregar</a></li>
<li><a id="t_tabs1-2" href="#tabs1-2"
onclick="$('#tabs1-2').load('/siap/default/listar_tipo_nomina');">Listar</a></li>
</ul>
<div id="tabs1-1">
{{=LOAD(c='default',f='agregar_tipo_nomina',args='',extension='html',ajax=True,ajax_trap=False)}}
</div><!-- tabs1-1 -->
<div id="tabs1-2" >
{{=LOAD(c='default',f='listar_tipo_nomina',args='',extension='html',ajax=True,ajax_trap=False)}}
</div><!-- tabs1-2 -->
</div><!-- tabs1 -->
<div id="tabs-2">
<div id="tabs2">
<ul>
<li><a href="#tabs2-1">Agregar</a></li>
<li><a href="#tabs2-2">Listar</a></li>
</ul>
<div id="tabs2-1">
hola
</div><!-- tabs2-1 -->
<div id="tabs2-2">
mundo
</div><!-- tabs2-2 -->
</div><!-- tabs2 -->
</div><!-- tabs-1 -->
</div><!-- tabs -->
2011/7/11, Ross Peoples <[email protected]>:
> I think because when a table is hidden behind a tab that it can't resize
> what's not visible. So if you listen for the tab change event and force
> datatables to refresh after a tab change, that should solve the problem.