angularjs select without ng-options or static options

Question

How, to use a static select in angularjs.

I wanna create a select ng-model with change event with statc values.

<form ng-controller="mycontroller">
    <select class="form-control"  name='modelid' ng-model="modelid"  ng-change="modelidchange">
        <option value="-1">select </option>       
        <option value='4'>Static text 4</option>
        <option value='1'>Static text 1</option>
        <option value='2'>Static text 2</option>                 
    </select>
</form>

my controller:

angular.module('app').controller('chapter',function($scope,$http) {
    console.log('ok')
    $scope.id = modelid
    alert($scope.id)
});

I just wanna get de model value, but this error:

Error: ngOptions:iexp
Invalid Expression

I DON'T WANNA USE NG-OPTIONS just a static select.

Can somebody help me ?

Hi, check out the last part of my answer... it should solve your problems the way you expected — Dennis Weidmann
– Dennis Weidmann, Commented Aug 11, 2015 at 20:11
Possible duplicate of Initializing select with AngularJS and ng-repeat — user447356
– user447356, Commented Jan 11, 2016 at 14:18

Community · Accepted Answer · 2017-05-23 12:26:20Z

2

check this jsfiddle link, maybe it will help

<select ng-model="filterCondition.operator">
    <option ng-selected="{{operator.value == filterCondition.operator}}" ng-repeat="operator in operators" value="{{operator.value}}">{{operator.displayName}}</option>

and this answer

edited May 23, 2017 at 12:26

CommunityBot

11 silver badge

answered Aug 11, 2015 at 20:05

macrog

2,0951 gold badge23 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dennis Weidmann · Accepted Answer · 2015-08-11 20:07:33Z

You first need to change your AngularJS Code a little bit...

From this

angular.module('app').controller('chapter',function($scope,$http){
                   console.log('ok')
    $scope.id = modelid
    alert($scope.id)
});

To this

angular.module('app').controller('chapter',function($scope,$http){
    $scope.id = $scope.modelid;
    alert($scope.id);
});

Next your Controller doesn't match... In HTML your Controller is

<form ng-controller="mycontroller">

In Angular your Controller is

.controller('chapter'...

So change it from this

<form ng-controller="mycontroller">

to this

<form ng-controller="chapter">

And last but not least :-)

You need to define the function you want to call with ng-change in your controller... So change the whole code to the following...

HTML

<form ng-controller="chapter">
    <select class="form-control"  name='modelid' ng-model="modelid"  ng-change="modelidchange()">
    <option value="-1">select </option>       
    <option value='4'>Static text 4</option>
    <option value='1'>Static text 1</option>
    <option value='2'>Static text 2</option>
</select>

Angular

angular.module('app').controller('chapter',function($scope,$http){
    $scope.modelidchange = function () {
        $scope.id = $scope.modelid;
        alert($scope.id)
    }
});

Collectives™ on Stack Overflow

angularjs select without ng-options or static options

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related