Mahmut Kilic Mahmut Kilic - 2 months ago 6
AngularJS Question

AngularJS function fails update with json string value

I have dropdown menu created with

ng-repeat
, however if the json is string, my function will fail. But it works just fine if its integer.

HERE IS EXAMPLE

As you guys can see, chart will upload just fine with year select dropdown.
I believe because data is integer for ex.
"year": 2011


I also have quarter dropdown. with
"quarter": "1"
, this will fail to update, however if I have
"quarter": 2
which works just fine.

<select class="YearSelector" ng-model="selectedyear" ng-change="sampleDropDown()">
<option ng-repeat="year in filterOptions.stores | unique: 'year'">
{{ year.year }}</option>
</select>
Quarter:
<select class="QuarterSelector" ng-model="$parent.quarter" ng-change="sampleDropDown()">
<option ng-repeat="quarter in filterOptions.stores | unique: 'quarter'">
{{ quarter.quarter }}</option>
</select>


My function:

$scope.sampleDropDown = function(){
myChart.data = getData(data, $scope.selectedyear, $scope.quarter);
myChart.draw(500);


}

Answer

Looks like your HTML markup causes option values end up with a leading carriage return. You can see it if you add a console.log like the following:

function getData(data, year, quarter) {
  console.log("year value '" + year + "'") ;

In the console you'll see:

"year value '
        2011'"

If you change your HTML option markup to be all on one line I think you'll be good-to-go, e.g. for the quarter:

<option ng-repeat ...>{{ quarter.quarter }}</option>

Also, you could use Angular's ngOptions instead of the option+ng-repeat combination.