CODEWITHSUNDEEP
htmlangularjs
Daft
Daft

Reputation: 10964

ng-click functions not firing inside html select element

I have the following html dropdown in an Angular view:

HTML

        <select>
          <option value="Func 1">
                <button class="btn ui-button ui-widget ui-state-default ui-corner-all" ng-click="callFunc1()">
                    <span class="btn-icon add"></span>
                    Func 1
                </button>   
          </option>
          <option value="Func 2">
                <button class="btn ui-button ui-widget ui-state-default ui-corner-all" ng-click="callFunc2()">
                    <span class="btn-icon add"></span>
                    Func 2
                </button>   
          </option>
        </select>

JS

        $scope.callFunc1= function() {
            alert('func 1');

        }; 

        $scope.callFunc2 = function() {
            alert('func 2');

        };

My problem is the functions attached to the ng-clicks aren't firing.

Can anyone tell me why?

Upvotes: 0

Views: 96

Answers (1)

user2263572
user2263572

Reputation: 5606

I would suggest following something similar to this format. How you decide to pass around the data is completely up to you, but this should provide some guidance. 

<div ng-controller="testCtrl">
    <!--js-->
    <script>
    app.controller('testCtrl',function($scope){

        $scope.selectValue = undefined;

        $scope.event = function(){
            console.log($scope.selectValue)
        }
    })
    </script>
    <div>
        <select ng-model="selectValue" ng-change="event()">
        <option value="test">something</option>
        <option value="test2">something2</option>
        </select>
    </div>
</div>

Make sure all html is within your controller and that you've initiated the body of your html with ng-app (not shown above). ng-change will fire the expression that you pass it when you make a change to the select input. Also, ng-change requires that you assign an ng-model value to your element.

Upvotes: 1

Related Questions