J'utilise une implémentation de base des onglets d'interface utilisateur JQuery fonctionnant bien, mais je veux définir (ou réinitialiser) l'onglet Actif de manière dynamique sur la base d'une action utilisateur.
Comment puis-je définir l'onglet Actif en fonction d'une valeur de querystring? Avec ma solution d'onglet précédente, j'ai pu passer une valeur de QueryString et définir l'onglet Actif lorsque la page est chargée. (Je devais abandonner cette solution ancienne en raison d'autres défis techniques.)
Lorsque l'utilisateur sélectionne le bouton Enregistrer dans mon navigateur Application et que la page de navigateur rechargne, comment puis-je maintenir la mise au point sur l'onglet qu'ils ont été précédemment avant de sauvegarder?
Comment puis-je définir l'onglet Actif lorsqu'un utilisateur retourne à la page Tâches de mon application de navigateur? Par exemple, tout au sein de mon application Web, si l'utilisateur navigue dans la page Projets, puis retourne à la page de tâche, comment puis-je réinitialiser l'onglet qu'ils étaient auparavant?
JavaScript: code d'exemple HTML:
3 Réponses :
Les onglets UI de JQuery peuvent prendre des options. Ceux qui sont particulièrement utiles pour vos questions sont cookie et sélectionné . Vous pouvez lire sur les options ici .
J'ai déjà lu cela avant, mais je ne comprends pas comment intégrer cela dans mon code de page ni comment accéder à une valeur de chaîne de requête. Pouvez-vous fournir un exemple de travail simple? Merci!
$ (".elector") .TABS ({sélectionné: 3}); fera la 4ème onglet initialement active et $ (".Selector") .Tabs ({cookie: {expire : 30}}); gardera l'onglet actif pour la dernière fois pendant 30 jours. Notez que vous aurez besoin du plugin de cookie: archive.plugins.jquery.com/project/cookie
J'ai résolu ma propre onglet JQuery Problèmes après une recherche et une erreur supplémentaires. Voici un exemple de travail. Je ne sais pas si c'est la solution la plus élégante, mais cela fonctionne. J'espère que cela vous aide.
$(document).ready(function() {
// Set active tab on page load
$("#tabs").tabs({active: document.tabTest.currentTab.value});
// Capture current tab index. Remember tab index starts at 0 for tab 1.
$('#tabs a').click(function(e) {
var curTab = $('.ui-tabs-active');
curTabIndex = curTab.index();
document.tabTest.currentTab.value = curTabIndex;
});
});
var currentTab = $('.ui-state-active a').index();
currentTab = $('#divMainContent').find('#sel_tab')[0].value;
Note: Where Sel_tab is hidden field.
onclick on tabs achor link assign value to hidden feild
Parse URL pour définir la valeur pour option active