Interfaccia utente di Jquery - ricaricare la scheda selezionata?

Question

C'è un modo per ricaricare la scheda selezionata. So che c'è la funzione .load(). Ma vuole un indice tab e non mi sembra di vedere un modo per afferrare l'id delle schede selezionate.

Answer 1

Aggiornamento: in jQuery 1.9, l'opzione selected viene rinominata in active. Vedi attomman's answer.

Per ottenere l'indice attualmente selezionato, utilizzare la funzione tabs('option','selected').

Ad esempio, se si dispone di un pulsante #button (e l'elemento #tabs è fatta in schede) in cui si desidera ottenere l'indice, effettuare le seguenti operazioni:

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

Ecco una demo: http://jsfiddle.net/sVgAT/

---

per rispondere alla domanda indicato dal titolo, in jQuery 1.8 e versioni precedenti, si dovrebbe fare:

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

E in jQuery 1.9 e più tardi, si dovrebbe fare:

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

Answer 2

sono riuscito a farlo funzionare, ma ora carica la prima scheda due volte quando non è attiva. Se qualcuno ha altri consigli su questo sarebbe molto apprezzato.

È possibile vedere sopra che la richiesta viene eseguita due volte sul server ma la prima richiesta viene eseguita correttamente in modo che annulli la seconda. Non sono sicuro se questo è un problema o no ..? Ma Im non essere rassicurato nel vedere che nella console

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 avuto la risposta corretta, ma questo è stato ormai deprecato dal JQuery UI 1,9

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

È ora possibile utilizzare 'attivo', invece di 'selezionato'

Così il codice sarà simile:

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

Answer 4

Nel caso in cui qualcun altro si imbattesse in questa domanda e - come me - sta usando le schede di jQuery EasyUI, la risposta di Simen sopra non funzionerà.Piuttosto, per aggiornare una scheda, uso:

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

Dove tt è la id del vostro gruppo scheda creata tramite

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

Answer 5

Scarica questo plugin per i cookie:

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

Inserire jQuery cookie alla tua pagina

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

e aggiungere questo:

$(".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);