CODEWITHSUNDEEP
angularjsangular-ui-bootstrapangularjs-ng-changeangular-ui-bootstrap-tab
madjack
madjack

Reputation: 2499

Select element not working in ui.bootsrap.tabs

I'm currently trying to use select element in tab blocks.

With ui.bootstrap.tabs, select html element not fire the model on javascript side. You can show my problem at plunkr. When you change the outside select element, it alerts selected items id normally. However, the second select element that inside the tab alerts only first selected items id.

Someone tell me that is a bug or my mistake?

Upvotes: 1

Views: 612

Answers (1)

Pranav Maniar
Pranav Maniar

Reputation: 1565

This is happening because your view is inside the uib-tabset and it has it's own scope. So selectOption model inside uib-tabset will be in the $scope of the uib-tabset and not in the $scope of the controller.

Hence everytime you change any value alert was showing 1.

I have created an updated plunkr which solves the problem. It can be found at : http://plnkr.co/edit/lbiUUY?p=preview

vm = this //This is the preferred way over $scope for defining variables

But, I suggest you to have a look at angular scope hierarchy. Angujs Scope

Upvotes: 3

Related Questions