ComboBox | Change Selected Index
by Manish Gupta
HTML
<link rel="stylesheet" href="http://cdn.wijmo.com/5.20173.380/styles/wijmo.min.css">
<script src="http://cdn.wijmo.com/5.20173.380/controls/wijmo.min.js"></script>
<script src="http://cdn.wijmo.com/5.20173.380/controls/wijmo.input.min.js"></script>
<script src="http://cdn.wijmo.com/5.20173.380/interop/angular/wijmo.angular.min.js"></script>
<div ng-app="app" >
<div ng-controller="appCtrl">
<div class="col-xs-12 col-md-2">
Select User to change Month
<p>
Month
</p>
<wj-combo-box
items-source="cmbMonth"
is-editable="false"
is-read-only="true"
wj-model-property="selectedValue"
ng-model="cmbMonthVal"
display-member-path="name"
selected-value-path="code">
</wj-combo-box>
</div>
<div class="col-xs-12 col-md-4">
<p>
User
</p>
<wj-combo-box
items-source="cmbUser"
selected-index-changed="cmbChgUser(s,e)"
is-editable="false"
wj-model-property="selectedValue"
ng-model="cmbUserVal"
display-member-path="name"
selected-value-path="code">
</wj-combo-box>
</div>
</div>
</div>
JavaScript
angular.module('app',['wj']).controller('appCtrl',function($scope){
$scope.cmbMonth=cmbMonth;
$scope.cmbUser=cmbUser;
$scope.cmbChgUser=function(s,e){
$scope.cmbMonthVal=s.selectedIndex;
}
});
var cmbMonth=[
{name:"January", code:0},
{name:"February", code:1},
{name:"March", code:2},
{name:"April", code:3},
{name:"May", code:4}
]
var cmbUser=[
{name:'Alex',code:'wj000'},
{name:'Bob', code: 'wj001'},
{name:'Chris', code:'wj002'},
{name:'David',code:'wj003'},
{name:'Evan',code:'wj004'}
]