jjjjjj jjjjjj - 3 months ago 9
AngularJS Question

AngularJS Select Box

I have a problem in select box in angularjs

I'm getting my locationList using this:

locationFactory.getLocation().then(function (data) {
$scope.locationList = data.data.locationList;
});


and the result is this: Result

And this is how I add it to select box in view:

<select ng-options="location.strBarangay for location in locationList"
ng-model="details.location" id="crOrderLoc">
</select>


My problem is, whenever I choose an option, there's always a blank option and it has a value of the first object in my json.
Example: I have a json objects [{1},{2},{3}]
And in my option it will arrange like this:


  1. option value=1 (it will show empty)

  2. option value=2 (it will show 1)

  3. option value=3 (it will show 2)



I tried this to set the value of my model in select

$scope.details.location = {
dblLocationPrice: $scope.locationList[0].dblLocationPrice,
intLocationID: $scope.locationList[0].intLocationID,
intLocationStatus: $scope.locationList[0].intLocationStatus,
strBarangay: $scope.locationList[0].strBarangay,
strCity: $scope.locationList[0].strCity
};


But there's an error:
angular.min.js:117 TypeError: Cannot read property '0' of undefined
at new prodSalesCtrl

But it's working here http://jsfiddle.net/MTfRD/3/ (edited)

But it's not working in my select

Answer

You need to set the default value of the select after loading the data:

locationFactory.getLocation().then(function (data) {
    $scope.locationList = data.data.locationList;
    if($scope.locationList && $scope.locationList.length>0)
        $scope.details.location = $scope.locationList[0];
});
Comments