0

I'M using chosen dropdown in angularJS. In chosen DD ng-change is not working. 

<div ng-controller="nSumInstalController">

<div>
    <select style="width:240px;" ng-model="circle" ng-change ="circleChange(circle)" ng-options="report.Circles for report in reportsValuesOptions track by report.id" chosen></select>
</div>

and Controller is

    $scope.reportsValuesOptions = 


[{
    "Circles": "All",
    "id": 0
  },
  {
    "Circles": "Balasore Circle",
    "id": 1
  },
  {
    "Circles": "Baripada Circle",
    "id": 2
  },
  {
    "Circles": "Bhadrak Circle",
    "id": 3
  },
  {
    "Circles": "Jajpur Road Circle",
    "id": 4
  },
  {
    "Circles": "Keonjhar Circle",
    "id": 5
  }
]
 $scope.circleChange = function (circle) {
     alert();
 })

and used Links:

https://cdnjs.cloudflare.com/ajax/libs/angular-chosen-localytics/1.4.0/angular-chosen.min.js https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.min.css

I don't know why it's not working and what i made wrong? Please help me this issue. I'm trying since 3 days.

Update: I'M using ng-include will it cause any issue?

Chanikya
  • 476
  • 1
  • 8
  • 22
  • You have space between `ng-change` and `="circleChange(circle)"` but I'm not sure whether chosen works with `ng-change`. You could change your model to [use dot](https://stackoverflow.com/questions/18128323/if-you-are-not-using-a-dot-in-your-angularjs-models-you-are-doing-it-wrong) and [watch](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch) changes on that value in your controller – barbsan Aug 03 '18 at 12:29

1 Answers1

0

Hope I have understood your problem correctly. I feel that you dont have to write chose seperately. 

<div ng-controller="nSumInstalController">
<div>
<select style="width:240px;" ng-model="circle" ng-change ="circleChange(circle)" ng-options="report.Circles for report in reportsValuesOptions track by report.id"></select>
</div>

The above should work fine.

Else try adding id and name attributes, like this:

<div ng-controller="nSumInstalController">
<div>
<select style="width:240px;" id="chosen" name="chosen" ng-model="circle" ng-change ="circleChange(circle)" ng-options="report.Circles for report in reportsValuesOptions track by report.id"></select>
</div>

Hope this helps you.

Jalpa Patel
  • 1
  • 1