CODEWITHSUNDEEP
angularjsjsonangularjs-directiveangularjs-scope
Mavericks
Mavericks

Reputation: 283

Data not being populated in drop down from JSON Response from REST in Angular js

I'm getting a JSON value from one WebService like this

"electricity":

{ "selectedElectricityBoard":"ABCD",

"electrictyConsumerNumber":"12345",

"isElectricityBoardChecked":true

}

I generated a Drop Down list from the JSON data,after that i select the value and submit the value, the value gets submitted successfully from my UI, now the case is I'm editing the same form for which i'm making a Web Service call which returns me the same value, which i have selected from the UI, but the selected value is not being populated/reflected in the drop-down menu, any suggestion or help would be highly appreciable, My UI is in Angular JS, the code snippet is as follows :

      <div class="col-xs-2 no-padding ">
      <label>Consumer No.:</label>
      </div>
      <div class="col-xs-3">
       <span ng-hide="true" class="form-control" ng-required="true"
        close-text="Close">
       </span>
     <div class="group-3-text-boxes col-xs-3 no-padding" style="min-width: 100px;">
     <input type="text" name="consumer_number"
 ng-disabled="!form_data[selectedTab].electricity.isElectricityBoardChecked"
 ng-model="form_data[selectedTab].electricity.electrictyConsumerNumber"
 class="input-field"
ng-class="{true:'invalid-field',false:''}
 form_data[selectedTab].electricity.isElectricityBoardChecked &&   form_data[selectedTab].invalid.electricity]" required />

Upvotes: 0

Views: 77

Answers (1)

AnilKumar
AnilKumar

Reputation: 21

<html ng-app="app" ng-controller="ctrl">
<select id="state" ng-model="states" ng-options="state for (state,states) in total_states">
    <option value=''>Select State</option>
</select>
<select id="district" ng-model="districts" ng-options="district for (district,districts) in states">
    <option value=''>Select District</option>
</select>
<select id="city" ng-model="cities" ng-options="cities for cities in districts">
    <option value=''>Select City</option>
</select>
<br>
<br>
<br>

State ::  {{states}}
<br>
<br>
<br>
District:: {{districts}}
<br>
<br>
<br>
City ::  {{cities}}

for controller:

app.controller('ctrl',ctrl);
ctrl.$inject=['$scope'];
function ctrl($scope) {
    $scope.total_states = {
        'Andhra Pradesh': {
            'Prakasam': ['Ongole', 'Chirala', 'Mrakapuram'],
            'Krishna': ['Vijayawada', 'Machalipatnam'],
            'Guntur': ['Guntur', 'Tenali', 'Bapatla']
        },
        'Telangana': {
            'Hyderabad': ['Hyderabad'],
            'Warangal': ['Wrangal', 'Hanmkonda'],
            'Khammam': ['Khmammam', 'Badrachalam']
        }
    };

}

try this it works...

Upvotes: 1

Related Questions