• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1345
  • Last Modified:

Preserve state of dropdown using tabs in AngularJS

Hi Experts,

I am developing single page application using angularjs,html5,bootstrap and ASP.net MVC.The landing page has 3 tabs and common Save for all the tabs and in one of the tab I have a dropdown and the code is  similar to below code in Angular.First time when the page loads the value for the dropdown should be "None" and if user selects a value  in the dropdown  and navigates to other tabs and return backs to dropdown and should see last selected option ie. I should maintain the previous state of the dropdown while navigating the tabs.

In the below example if I select  option "Yellow" and then navigate to other tabs and back to original tab it should retain "Yellow" option. That means I should only show "None" at the first time when user Login.

In the code , I am just initializing the dropdown value  to "None" in the controller at all times , but I need this to be "None" only first time.How can I achieve this using angularjs?


 $scope.state = $scope.status[0]; //This will always set tDropdown to None 

Open in new window


demo
0
ksd123
Asked:
ksd123
  • 2
1 Solution
 
Ioannis ParaskevopoulosCommented:
Hi,

I think you need to check $scope.state before setting it:
    if (typeof $scope.state === 'undefined') {
            $scope.state = $scope.status[0];
    }

Open in new window


Giannis
0
 
ksd123Author Commented:
I tried above code and it's  not working,when I switch between tabs , it always select "None" option in the dropdown selection.
0
 
ksd123Author Commented:
Thank you.  Actually there is typo in my code and later I  figure it out and  now the above code is working fine for my issue.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now