Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I am new in angular and json so if any one can help me.

I have json array In which I have users and the names of sellers from users buy stuff.

Json:

[
  {
    "name":"Kakaro",
    "sallers":[
     {"sellername":"Naruto","payment":"250","date":"07\/07\/2014","receipt":"popup"},
     {"sellername":"Sasuka","payment":"502","date":"08\/07\/2014","receipt":"popup"}
    ]
  },
  {
    "name":"Collin Ferall",
    "sallers":[
      {"sellername":"Jonny deep","payment":"250","date":"07\/07\/2014","receipt":"popup"},
      {"sellername":"Brad Pitt","payment":"502","date":"08\/07\/2014","receipt":"popup"}
    ]
  }
]

What I am trying to do: When a we select user then data of user's seller come in table.

I have seen many solution but I have failed in all solution. now I am at the beginning where I started.

Problem: I don't know how to properly call array in another array angular.

html:

<div id="main" class="row" ng-controller='payment'>
  <div>
    <label>Client Name:</label><br/>
    <select class="form-control input-sm" name="client_name">
      <option ng-repeat="names in name" value="{{names.name}}" ng-model="select">{{names.name}}</option>
    </select>
  </div>
  <div id="seller" class="margins_top">
    <table class="table table-bordered">
      <thead>
        <tr>
          <td>Seller Name</td>
          <td>Payment</td>
          <td>Date</td>
          <td>Payment Receipt</td>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="sellers in seller">
          <td>{{sellers.sellername}}</td>
          <td>{{sellers.payment}}</td>
          <td>{{sellers.date}}</td>
          <td>{{sellers.receipt}}</td>
        </tr>
      </tbody>
    </table>
  </div><!-- /#seller -->
</div>  

Controller js:

var app = angular.module('payment', []);


app.controller('payment',function($scope,$http){
  getrecord(); // Load all available tasks 
  function getrecord(){  
    $http.post("angular/ajax/payment.php").success(function(data){
      $scope.name = data;
      $scope.seller = data[0].sallers;
    });
  }
});

I have create fiddle but it was not use but still I am adding it.

Fiddle

share|improve this question
up vote 1 down vote accepted

try it like this

in your HTML

    <select class="form-control input-sm" name="client_name" ng-model="select">
  <option ng-repeat="names in name" value="{{names.name}}">  {{names.name}}</option>
</select>

and in your JS

$scope.$watch('select', function(newvalue) {
            angular.forEach($scope.name, function(value, key) {
                if(value.name == newvalue) {
                $scope.seller = value.sallers;
                }
            });
            });
share|improve this answer
    
can you tell me how will i call "sallers" in newvalue – Xitas Jul 22 '14 at 11:07
    
I have tried data[0].sallers; but it is one showing data of first user only! – Xitas Jul 22 '14 at 11:08
    
use you are right, wait a minute i fix it – ThomasP1988 Jul 22 '14 at 11:08
    
i edited my answer, try it like this – ThomasP1988 Jul 22 '14 at 11:13
1  
Thank you so much it work like a dream :D – Xitas Jul 22 '14 at 11:14

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.