jjjjjj
jjjjjj

Reputation: 35

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

Upvotes: 0

Views: 116

Answers (1)

Dev Shah
Dev Shah

Reputation: 302

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];
});

Upvotes: 1

Related Questions