Angularjs click on a link and highlight a tabWhich “href” value should I use for JavaScript links, “#” or “javascript:void(0)”?How do I detect a click outside an element?Open a URL in a new tab (and not a new window) using JavaScriptHow does data binding work in AngularJS?'this' vs $scope in AngularJS controllersHow do I access the $scope variable in browser's console using AngularJS?What are the nuances of scope prototypal / prototypical inheritance in AngularJS?“Thinking in AngularJS” if I have a jQuery background?How do I use $scope.$watch and $scope.$apply in AngularJS?AngularJS: Service vs provider vs factory
Federal Pacific 200a main panel problem with oversized 100a 2pole breaker
Is the internet in Madagascar faster than in UK?
How to determine algebraically whether an equation has an infinite solutions or not?
How can I download a file from a host I can only SSH to through another host?
Can an object tethered to a spaceship be pulled out of event horizon?
Why does the `ls` command sort files like this?
Does trying to charm an uncharmable creature cost a spell slot?
How to emphasise the insignificance of someone/thing – besides using "klein"
Is Nikon d500 a good fit for nature and ambient-lighting portraits and occasional other uses?
How many petaflops does it take to land on the moon? What does Artemis need with an Aitken?
Why does glibc's strlen need to be so complicated to run fast?
How to pass 2>/dev/null as a variable?
Group riding etiquette
Is a memoized pure function itself considered pure?
What's the point of fighting monsters in Zelda BoTW?
Is this password scheme legit?
What to do about my 1-month-old boy peeing through diapers?
What is the name of this plot that has rows with two connected dots?
If I said I had $100 when asked, but I actually had $200, would I be lying by omission?
Why does a sticker slowly peel off, but if it is pulled quickly it tears?
Is the Amazon rainforest the "world's lungs"?
Why does this London Underground poster from 1924 have a Star of David atop a Christmas tree?
Why does the weaker C–H bond have a higher wavenumber than the C=O bond?
Defending Castle from Zombies
Angularjs click on a link and highlight a tab
Which “href” value should I use for JavaScript links, “#” or “javascript:void(0)”?How do I detect a click outside an element?Open a URL in a new tab (and not a new window) using JavaScriptHow does data binding work in AngularJS?'this' vs $scope in AngularJS controllersHow do I access the $scope variable in browser's console using AngularJS?What are the nuances of scope prototypal / prototypical inheritance in AngularJS?“Thinking in AngularJS” if I have a jQuery background?How do I use $scope.$watch and $scope.$apply in AngularJS?AngularJS: Service vs provider vs factory
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;
0
I need to click on a link and maintain a tab active,
this code are the tabs that are working right, maintaining the tab active:
<ul class="nav nav-tabs" role="tablist" id="MovieContent">
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</li>
</ul>
This is my attempt and it is not maintaining active the clicked tab, this code is inside the first tab only:
<div class="nav nav-tabs" role="tablist" id="MovieContent">
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</div>
</div>
javascript angularjs
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
add a comment |
0
I need to click on a link and maintain a tab active,
this code are the tabs that are working right, maintaining the tab active:
<ul class="nav nav-tabs" role="tablist" id="MovieContent">
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</li>
</ul>
This is my attempt and it is not maintaining active the clicked tab, this code is inside the first tab only:
<div class="nav nav-tabs" role="tablist" id="MovieContent">
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</div>
</div>
javascript angularjs
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
1
Any perticular reason you changed theulandliindivs?
– Frank Witte
Mar 27 at 23:21
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12
add a comment |
0
0
0
I need to click on a link and maintain a tab active,
this code are the tabs that are working right, maintaining the tab active:
<ul class="nav nav-tabs" role="tablist" id="MovieContent">
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</li>
</ul>
This is my attempt and it is not maintaining active the clicked tab, this code is inside the first tab only:
<div class="nav nav-tabs" role="tablist" id="MovieContent">
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</div>
</div>
javascript angularjs
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
I need to click on a link and maintain a tab active,
this code are the tabs that are working right, maintaining the tab active:
<ul class="nav nav-tabs" role="tablist" id="MovieContent">
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</li>
<li class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</li>
</ul>
This is my attempt and it is not maintaining active the clicked tab, this code is inside the first tab only:
<div class="nav nav-tabs" role="tablist" id="MovieContent">
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['DUB'])">
<a class="tab nav-link" data-toggle="tab" href="#Dubled_mov.ID"
ng-class="active: language=='dubbed'" ng-click="language='dubbed'">
Dubbed
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['LEG'])">
<a class="tab nav-link" data-toggle="tab" href="#Legended_mov.ID"
ng-class="active: language=='legended'" ng-click="language='legended'">
Legended
</a>
</div>
<div class="nav-item" ng-show="checkLength(movieSessions[mov.ID]['NAC'])">
<a class="tab nav-link" data-toggle="tab" href="#National_mov.ID"
ng-class="active: language=='national'" ng-click="language='national'">
National
</a>
</div>
</div>
javascript angularjs
javascript angularjs
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
edited Mar 28 at 12:09
Ângelo Rigo
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
asked Mar 27 at 20:42
Ângelo RigoÂngelo Rigo
8124 gold badges20 silver badges39 bronze badges
8124 gold badges20 silver badges39 bronze badges
1
Any perticular reason you changed theulandliindivs?
– Frank Witte
Mar 27 at 23:21
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12
add a comment |
1
Any perticular reason you changed theulandliindivs?
– Frank Witte
Mar 27 at 23:21
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12
1
1
Any perticular reason you changed the
ul and li in divs?– Frank Witte
Mar 27 at 23:21
Any perticular reason you changed the
ul and li in divs?– Frank Witte
Mar 27 at 23:21
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55386112%2fangularjs-click-on-a-link-and-highlight-a-tab%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.
Is this question similar to what you get asked at work? Learn more about asking and sharing private information with your coworkers using Stack Overflow for Teams.
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55386112%2fangularjs-click-on-a-link-and-highlight-a-tab%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Any perticular reason you changed the
ulandliindivs?– Frank Witte
Mar 27 at 23:21
in fact i am duplicating information from the tabs inside the first tab, to avoid users saying they did not find that information so i change to divs inside the first tab
– Ângelo Rigo
Mar 28 at 11:10
but can be into any tag so that the link will work
– Ângelo Rigo
Mar 28 at 11:33
Does the active class get assigned? What if you manually add the active class to your <a>, does it get highlighted?
– FelDev
Mar 28 at 12:17
The active class of the tabs is not assigned, how can i manually add the active class ?
– Ângelo Rigo
Mar 28 at 13:12