CODEWITHSUNDEEP
angularjs
GMan
GMan

Reputation: 119

ng-click is not working for default option in select box

I have added

<select ng-model="some_value"
                    ng-options="item.tt  for item in  data" ng-change="fnCall()" style="width: 85%" id="first">
                    <option value="" ng-click="fnCall()">--Select Value--/option>
            </select>

But on click of select value(default option), the function is not called, any idea?

Upvotes: 1

Views: 1428

Answers (1)

Index
Index

Reputation: 2381

The option tag doesn't have a click event (at least not in the way you're trying to use it), only the select element does.

Stick with ng-change, it should be called with a default value (null) if the default option is selected.

Update:

To achieve what you want, either bind a span/h4/any-element with the text "Select a value" to the model with an ng-hide="some_value". Or, use fnCall(some_value) to display an alert.

Example: https://jsfiddle.net/HB7LU/13105/

<div ng-controller="MyCtrl">
    <select ng-model="test" ng-change="fnCall(test)" ng-options="val for val in values">
        <option value="">Select a value</option>
    </select>
</div>

-

var myApp = angular.module('myApp', []);   

function MyCtrl($scope) {
    $scope.values = [1, 2, 3]
    $scope.fnCall = function (val) {
        if (!val) {
            alert('Please select a value');
        }
    }
}

Upvotes: 4

Related Questions