Make option selected by default using chosen and angularJS

Question

Make option selected by default using chosen and angularJS

684 Views Asked by XDProgrammer At 06 April 2025 at 15:08

Im not sure why is it that the option is not selected by default, the values are hard coded and I explicitly added 'selected' attribute on option tag but its not working. I also tried selected="selected" but still its not working.

in View:

<div class="controls">
            <select chosen="" data-ng-model="assignments"  multiple="" 
                    class="span chzn-select" style="width: 150px">
                <option value="Police">Police</option>
                <option selected value="Reporter">Reporter</option>
                <option value="Developer">Developer</option>
            </select>
        </div>

Original Q&A

There are 1 best solutions below

**Ronnie** · Accepted Answer

This would work if you didn't have the multiple attribute. In order to get this wto work with a multuple select, you need to set it up using ng-options and then store an array of what should be selected. See this fiddle:https://jsfiddle.net/btqLg76v/1/

JS:

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

app.controller('MyController', function($scope) {
  $scope.selectOptions = ['Police','Reporter','Developer'];
  $scope.assignments = [$scope.selectOptions[0],$scope.selectOptions[2]];
  console.log($scope.assignments);
});

HTML:

<body ng-app="MyApp">
  <div ng-controller="MyController">
    <select ng-model="assignments" ng-options="selectOptions for selectOptions in selectOptions" multiple>
    </select>
  </div>
</body>

Make option selected by default using chosen and angularJS

There are 1 best solutions below

Related Questions in ANGULARJS

Related Questions in ANGULAR-CHOSEN

Trending Questions

Popular # Hahtags

Popular Questions