Jquery UI - ¿volver a cargar la pestaña seleccionada?

Question

¿Hay alguna manera de volver a cargar la pestaña seleccionada? Sé que existe la función .load(). Pero quiere un índice de pestañas y no veo una manera de tomar la identificación de las pestañas seleccionadas.

Answer 1

Actualización: En jQuery 1.9, la opción selected se renombra a active. Consulte attomman's answer.

Para obtener el índice seleccionado actualmente, use la función tabs('option','selected').

Por ejemplo, si usted tiene un botón #button (y el elemento #tabs se hace en pestañas) en la que desea obtener el índice, haga lo siguiente:

$("#button").click(function() { 
    var current_index = $("#tabs").tabs("option","selected"); 
}); 

He aquí una demostración: http://jsfiddle.net/sVgAT/

---

Para responder a la pregunta indicada por el título, en jQuery 1.8 y anteriores, que haría:

var current_index = $("#tabs").tabs("option","selected"); 
$("#tabs").tabs('load',current_index); 

Y en jQuery 1.9 y posteriores, puede hacer:

var current_index = $("#tabs").tabs("option","active"); 
$("#tabs").tabs('load',current_index); 

Answer 2

me las arreglé para conseguir que esto funcione, pero ahora carga la primera ficha dos veces cuando no está activo. Si alguien tiene más consejos sobre esto, sería muy apreciado.

Puede ver arriba que la solicitud se realiza dos veces en el servidor, pero la primera solicitud se realiza con éxito, por lo que cancela la segunda. ¿No estoy seguro de si esto es un problema o no ...? Pero no estoy siendo tranquilizado por verlo en la consola

constructor: (@element) -> 
    @tabIndex = 0 
    @tabs = @element.find('#tabs') 
    @tabs.tabs 
     spinner: "Loading.." 
     cache: false 
     ajaxOptions: 
     cache: false 
     error: (xhr, status, index, anchor) -> 
      $(anchor.hash).html "Couldn't load this tab. We'll try to fix this as soon as possible." 

    #add custom load to make sure they always reload even the current tab when clicked 
    @element.find('ul li a').click (e) => 
     if @tabIndex is @tabs.tabs('option', 'selected') 
     @tabs.tabs 'load', @tabs.tabs('option', 'selected') 
     @tabIndex = @tabs.tabs('option', 'selected') 

Answer 3

Simen tenía la respuesta correcta, pero esto ahora es obsoleta desde jQuery UI 1,9

http://jqueryui.com/upgrade-guide/1.9/#deprecated-selected-option-renamed-to-active

Ahora utiliza 'activa' en vez de 'selected'

Así que el código se verá así:

var current_index = $("#tabs").tabs("option","active"); $("#tabs").tabs('load',current_index);

Answer 4

En caso de que alguien más se tropiece con esta pregunta y, como yo, utilice las pestañas de jQuery EasyUI, la respuesta anterior de Simen no funcionará.Por el contrario, para refrescar una ficha, utilice:

var tab = $('#tt').tabs('getSelected'); 
tab.panel('refresh'); 

Dónde tt es el id de su grupo pestaña creada a través de

<div id="tt" class="easyui-tabs"> 

Answer 5

Descargar este plugin para las galletas:

http://plugins.jquery.com/cookie/

Insertar jQuery cookie a su página

<script src="jquery.cookie.js"></script> 

y añadir lo siguiente:

$(".tabs").click(function() { 
    //getter , get the active tab 
    var active = $("#tabs").tabs("option", "active"); 
    $.cookie("tabs_selected", active); 
}); 

var cookieValue = $.cookie("tabs_selected"); 
// setter, set the active tab stocked 
$("#tabs").tabs("option", "active",cookieValue);