google/material-design-lite
1
1
Fork 0
mirror of https://github.com/google/material-design-lite.git synced 2024-08-16 15:50:34 +03:00
Code Issues Projects Releases Wiki Activity

Add public method setTab to set the active tab programmatically

Browse Source
This commit is contained in:
Erik Koopmans 2017-04-12 15:32:59 -04:00 committed by Jonathan Garbee
parent 2ae138280a
commit 20b941bb30
1 changed files with 19 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/tabs/tabs.js
View File

@ -110,6 +110,24 @@
}
};
/**
* Set the active tab.
*
* @public
* @param {Element|number} tab The tab element or index to set active.
*/
MaterialTabs.prototype.setTab = function(tab) {
tab = (typeof tab === 'number') ? this.tabs_[tab] : tab;
if (tab && tab.getAttribute('href').charAt(0) === '#') {
var href = tab.href.split('#')[1];
var panel = this.element_.querySelector('#' + href);
this.resetTabState_();
this.resetPanelState_();
tab.classList.add(this.CssClasses_.ACTIVE_CLASS);
panel.classList.add(this.CssClasses_.ACTIVE_CLASS);
}
};
/**
* Initialize element.
*/
@ -141,12 +159,7 @@
tab.addEventListener('click', function(e) {
if (tab.getAttribute('href').charAt(0) === '#') {
e.preventDefault();
var href = tab.href.split('#')[1];
var panel = ctx.element_.querySelector('#' + href);
ctx.resetTabState_();
ctx.resetPanelState_();
tab.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
panel.classList.add(ctx.CssClasses_.ACTIVE_CLASS);
ctx.setTab(tab);
}
});