Hi I'm using angular tab directive.The link for JS fiddle is AngularJs Tab Directive .My Question is How can I move to second tab from first tab with click of a button?Thanks
<tabs>
<pane title="First Tab">
<button type="button" ng-click="moveToSecondTab()">Second Tab.</button>
</pane>
<pane title="Second Tab">
<div>This is the content of the second tab.</div>
</pane>
Instead of hardcoding the panes in your HTML file, fetch it from your controller. Something like
$scope.tabs = [
{ title:'Dynamic Title 1', content:'Dynamic content 1' },
{ title:'Dynamic Title 2', content:'Dynamic content 2', disabled: true }
];
Then from your HTML you can call the function to switch the active tab. Something like this :
$scope.moveToSecondTab = function () {
$scope.tabs[1].active = true;
};
However, it'll be better if instead of a function, you switch the active tab directly from the button.
Use something like this:
<button ng-click="tabs[1].active = true">Select second tab</button>.
Check here for reference.
Trigger a click on the second tab. This works for me.
<!--HTML-->
<tab id="tabID" heading="Second Tab">
///JS
$timeout(function(){
angular.element('#tabID a').trigger('click');
});
