How to display nested JSON data using angularjs - javascript

I ma trying to call JSON file in Angular controller using below code, I spent 2 days on it but nothing works, please help
[{
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}, {
"enquiry_data": {
"car_model": "images/mercedes-gla-class-primary.jpg",
"car_name": "gla-class",
"user_name": "sanjay",
"user_phone": "9874563210",
"status": "active",
"status_stage": "test drive given",
"date": "05 may 2017",
"time": "02:50 pm",
"timeline": {
"0": {
"status": "accepted",
"date": "15 may"
},
"1": {
"status": "follow up",
"date": "18 may"
},
"2": {
"status": "follow up",
"date": "20 may"
},
"3": {
"status": "next",
"date": "24 may"
}
}
}
}]
-------------------------------------------
var enquiryApp = angular.module('enquiryList', []);
enquiryApp.controller('enquiryCtrl', function($scope, $http){
$http.get('js/timeLine.json').then(function(data){
// $scope.features = response.data;
$scope.enqList = [];
angular.forEach(data, function(enquiry_data){
angular.forEach(enquiry_data.timeline, function(timeline){
$scope.enqList.push({
enqList:enquiry_data.car_name,
});
});
console.log($scope.enqList.car_name);
});
// console.log(response.data.items[0].enquiry_data.car_name);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js">
</script>
<div ng-controller="enquiryCtrl">
<div class="enquery-block" ng-repeat="x in enqList">
<div class="enquiryInfo">
<div class="row">
<div class="col-sm-3">
<img src="images/mercedes-gla-class-primary.jpg" class="img-responsive" alt="b Class">
<figcaption>{{x.car_name}}</figcaption>
</div>
<div class="col-sm-6">
<h1>sanjay kumar singh</h1>
<h3>9876543210</h3>
</div>
<div class="col-sm-3">
<div class="enqStatus">
<p><i class="fa fa-circle green"></i>active</p>
<p>test drive given</p>
</div>
</div>
</div>
</div>
<div class="enquirystatus">
<div id="timeLine" class="timeLine">
<div class="line"></div>
<ul>
<li>
<div class="staDate">
<p>Accepted</p>
<p>22 May</p>
</div>
<span></span>
</li>
</ul>
</div>
</div>
<div class="enquiryAction">
<div class="row">
<div class="col-sm-6">
<div><span><img src="images/calendar.png"></span>22 May 2017 <span>/</span> 02:15 pm</div>
</div>
<div class="col-sm-6">
<button class="btn btn-default pull-right" data-toggle="modal" data-target="#statusModal">add follow up</button>
</div>
</div>
</div>
</div>
</div>
thing is working, I am trying call JSON file in Angular controller and want to display data in view, but no error and nothing is working, below is my code, please help.

You should replace :
$scope.enqList.push({
enqList : enquiry_data.car_name,
});
with :
$scope.enqList.push({
car_name: enquiry_data.car_name,
});
So now this works :
<div class="enquery-block" ng-repeat="x in enqList">
<figcaption>{{x.car_name}}</figcaption>
</div>

Here is the solution.
var app = angular.module('demo', []);
app.controller('MainCtrl', function($scope, $http) {
$http.get("data.json").then(function(data){
$scope.rooms = data.data;
console.log($scope.rooms);
});
});
<ul ng-repeat="x in rooms" class="list">
<li>{{x.car_model}}</li>
<ul ng-repeat="b in x.timeline" class="timeline">
<li>
<p>{{b.stat}}</p>
<p>{{b.date}}</p>
</li>
</ul>
</ul>

Related

Looping nested Json data in NodeJS

In my mockdata I was able to loop through some data for the most part.
When you get to students within upcoming you can see that I nested some data.
The issue I am having is being able to print that nested data.
{
"upcoming": [{
"id": 1,
"date": "Feb 2nd, 2018",
"time": "2 to 4pm",
"status":"$45",
"course": "Oil Painting",
"course_type": "(Individual)",
"student":[
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
}
]
},{
"id": 2,
"date": "Feb 2nd, 2018",
"time": "2 to 4pm",
"status":"$45",
"course": "Oil Painting",
"course_type": "(Group)",
"student":[
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
}
]
},{
"id": 2,
"date": "Feb 2nd, 2018",
"time": "2 to 4pm",
"status":"$45",
"course": "Oil Painting",
"course_type": "(Group)",
"student":[
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
}
]
}],
"future":[{
"id": 1,
"date": "Feb 2nd, 2018",
"time": "2 to 4pm",
"status":"$45",
"course": "Oil Painting",
"course_type": "(Group)",
"student":[
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
},
{
"name": "Ann Perkins",
"image": "/img/student-icon.png"
}
]
}]
}
I am able to print the date, status, and course into my ejs template, but when I try to display the students images I get an error saying it is undefined.
<% data.upcoming.forEach((record) => { %>
<tr>
<td><%=record.date%>
<span style="display: block;font-size:10pt;">3 to 4pm</span>
</td>
<td>Recieved
<span style="display:block; font-size: 16pt; color:#7c0000;"><%=record.status%></span>
</td>
<td><%=record.course%>
<span style="display:block;font-size:10pt;"><%=record.course_type%></span>
</td>
<td>
LOOK HERE
<% data.upcoming.student.forEach((person) => { %>
<img rel="tooltip" data-placement="top" title="Ann Perkins" src="<%=person.image%>">
<% }) %>
</td>
<% }) %>
Am I using the right method to get the array of objects within students?
You need to replace data.upcoming.student.forEach((person) => { with record.student.forEach(...)
The student array lies within the array that you are looping above in the ejs template's first line

Java script inner array response parsing

I am new to javascript. i want to parse this response .
var date=[];
var details=[];
for(post in resulttable.posts){
date=date.concat(resulttable.posts[post].days.Date);
details= details.concat(resulttable.posts[post].days.details);
}
I dont know where am missing. please help me , I want those details in one array and dates to be another array.
{
"status": 1,
"count": 2,
"posts": [{
"days": {
"details": [{
"place": "labs",
"StartTime": "01:00:00",
"EndTime": "02:00:00",
"Description": "Meeting with team",
"participants": [{
"Name": "KK",
"Designation": "VP, Operations",
"ContactNumber": "111"
}, {
"Name": "MN1",
"Designation": "Project Lead",
"ContactNumber": "111"
}]
}],
"Date": ["2017-02-02"]
},
"name": "test"
}, {
"days": {
"details": [{
"place": "India",
"StartTime": "01:00:00",
"EndTime": "03:00:00",
"Description": "Agenda1",
"participants": [{
"Name": "Kk",
"Designation": "VP, Operations",
"ContactNumber": "11111"
}, {
"Name": "MN",
"Designation": "Project Lead",
"ContactNumber": "111"
}]
}, {
"place": "microsoft",
"StartTime": "01:00:00",
"EndTime": "02:00:00",
"Description": "Meet CEO",
"participants": [{
"Name": "VR",
"Designation": "Project Lead",
"ContactNumber": "111"
}]
}, {
"place": "microsoft",
"StartTime": "01:00:00",
"EndTime": "02:00:00",
"Description": "Meet CEO",
"participants": [{
"Name": " VR",
"Designation": "Project Lead",
"ContactNumber": "111"
}]
}, {
"place": "Formule",
"StartTime": "10:50:00",
"EndTime": "11:50:00",
"Description": "Meet Rajesh",
"participants": [{
"Name": "MN",
"Designation": "Project Lead",
"ContactNumber": "111"
}]
}, {
"place": "Dell",
"StartTime": "04:00:00",
"EndTime": "08:00:00",
"Description": "Agenda 2",
"participants": [{
"Name": "MN",
"Designation": "Project Lead",
"ContactNumber": "1111111"
}]
}],
"Date": ["2017-02-03"]
},
"name": "test"
}]
}
Check this fiddle
var details = new Array();
var dates = new Array();
for (var i = 0; i < resulttable.posts.length; i++) {
dates = dates.concat(resulttable.posts[i].days.Date);
details = details.concat(resulttable.posts[i].days.details);
}
console.log(details);
console.log(dates);
Or
var details = new Array();
var dates = new Array();
for (post of resulttable.posts) {
dates = dates.concat(post.days.Date);
details = details.concat(post.days.details);
}
console.log(details);
console.log(dates);

angularjs 1.x filter for array type

I have lot of objects like below in array now i want to apply filter on it. How i can apply filter like i have mention in image:
Can i use simple AngularJS filter on it?
Kindly help me with best approach to apply these filter. Thanks in advance. I have multiple hotels data like that in this JSON. But I am not butting it all because of space.
[
{
"_id": "57da6aeb4eafac04afd01bc5",
"name": "subways",
"city": "lahore",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [
{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [
{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
},
{
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
},
{
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
},
{
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}
]
}
]
A simple AngularJS filter to handle such operations is shown below:
angular.module("myapp", [])
.controller("myctrl", function myctrl($scope) {
$scope.cityIncludes = [];
$scope.includeCity = function(city) {
console.log( city );
var i = $scope.cityIncludes.indexOf(city);
if (i > -1) {
$scope.cityIncludes.splice(i, 1);
} else {
$scope.cityIncludes.push(city);
}
console.log( $scope.cityIncludes);
}
$scope.cityFilter = function(city) {
if ($scope.cityIncludes.length > 0) {
if ($scope.cityIncludes.indexOf(city.city) < 0)
return;
}
return city;
}
$scope.rests = [{
"_id": "57da6aeb4eafac04afd01bc5",
"name": "Lahore Restaurant",
"city": "lahore",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}]
}]
}, {
"_id": "57da6aeb4eafac04afd01bc5",
"name": "islamabad rest",
"city": "islamabad",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}]
}]
}, {
"_id": "57da6aeb4eafac04afd01bc5",
"name": "abcd",
"city": "rawalpindi",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}]
}]
}, {
"_id": "57da6aeb4eafac04afd01bc5",
"name": "asdadsasdasdas",
"city": "karachi",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}]
}]
}, {
"_id": "57da6aeb4eafac04afd01bc5",
"name": "multan asdasda",
"city": "multan",
"area": "johar town",
"min_order": "200 AED",
"del_time": "1 hour",
"del_fees": "1 AED",
"pre_order": "NA",
"rating_star": "4",
"rating_no": 514,
"status": "OPEN",
"__v": 0,
"categories": [{
"_id": "57da72e94eafac04afd01bc9",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"name": "subways Burger",
"category_id": "1",
"__v": 0,
"items": [{
"_id": "57da7973d0b5e2059c5ff10a",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 1",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79e8d0b5e2059c5ff10b",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 2",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79efd0b5e2059c5ff10c",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 3",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}, {
"_id": "57da79fcd0b5e2059c5ff10d",
"restaurant_id": "57da6aeb4eafac04afd01bc5",
"category_id": "57da72e94eafac04afd01bc9",
"logo": "abcLogo",
"name": "subway item 4",
"detail": "great item",
"price": "10",
"rating": "5",
"__v": 0
}]
}]
}]
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myapp" ng-controller="myctrl">
<ul>
<li ng-repeat="rest in rests track by rest.city">
<input name="rest.city" type="checkbox" value="rest.city" ng-click="includeCity(rest.city)">
<label for="rest.city">{{rest.city}}</label>
</li>
</ul>
<ul>
<li ng-repeat="rest in rests | filter: cityFilter">
<p ng-bind="rest.name"></p>
<p ng-bind="'Rating ' + rest.rating_star"></p>
<p ng-bind="'Status ' + rest.status"></p>
<p ng-bind="'Area ' + rest.area"></p>
</li>
</ul>
</body>
You can use this concept.
i have done
i have radio box for all type of cuisines when any one select. i save it into scope type variable with below function. now question is how i filter it bro.
<ul>
<li>
<input name="rest.cusine" type="radio" value="india" ng-click="filterCuisine('indian')">
<label for="open status">india</label>
</li>
<li>
<input name="rest.cusine" type="radio" value="india" ng-click="filterCuisine('pakistani')">
<label for="open status">pakistan</label>
</li>
<li>
<input name="rest.cusine" type="radio" value="arabic" ng-click="filterCuisine('arabic')">
<label for="open status">arabic</label>
</li>
</ul>
Function for getting the selected cuisine
$scope.filterCuisine = function(cuisine){
$scope.checkFilterCuisine = cuisine;
console.log($scope.checkFilterCuisine);
}
how i apply filter on this function
$scope.selectCuisine = function(city){
console.log(city.cuisines);
if (city.cuisines.length > 0 && $scope.checkFilterCuisine != '') {
if (city.cuisines.indexOf($scope.checkFilterCuisine) < 0){
return;
}
}
return city;
}

ng-repeat of JSON which have index on it

I have a json like this
{
"0": {
"Order_Id": "100000001",
"prodct_Status": "Pending",
"Price": "8.0000",
"date_created": "Jun 4, 2014 7:55:42 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
},
"1": {
"Order_Id": "100000002",
"prodct_Status": "Pending",
"Price": "38.4600",
"date_created": "Jun 7, 2014 6:37:48 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
},
"2": {
"Order_Id": "100000003",
"prodct_Status": "Pending",
"Price": "44.9200",
"date_created": "Jun 10, 2014 4:52:46 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
}
}
I wanna do ng repeat in this json . I have those 0 1 index there which i can not remove .
you can use the standard ng-repeat syntax:
<body ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
<div ng-repeat="item in data">
{{item.Order_Id}}
{{item.Region}}
</div>
</body>
controller:
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.data = {
"0": {
"Order_Id": "100000001",
"prodct_Status": "Pending",
"Price": "8.0000",
"date_created": "Jun 4, 2014 7:55:42 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
},
"1": {
"Order_Id": "100000002",
"prodct_Status": "Pending",
"Price": "38.4600",
"date_created": "Jun 7, 2014 6:37:48 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
},
"2": {
"Order_Id": "100000003",
"prodct_Status": "Pending",
"Price": "44.9200",
"date_created": "Jun 10, 2014 4:52:46 AM",
"Shipping_Address": "vbccv",
"Region": "Arizona",
"Country": "US"
}
};
});
http://plnkr.co/edit/o7pQvhh2KKL7xgqhtL5L?p=preview
ng-repeat can iterate with objects as well:
<div ng-repeat="(index, order) in {'0':{'Order_Id':'1'},'1':{ 'Order_Id': '2'}}">
<span>{{ order.Order_Id }}</span>
</div>
In your case string index can be ignored. See also this answer.
Try it like this
var json = { /* your json goes here */ };
<ul>
<li ng-repeat="(key,value) in json">
{{key}} {{value.Price}}
</li>
</ul>
http://plnkr.co/edit/01vry4469ggGs1O1i5tI?p=preview

Parsing JsonP with Javascript

I am trying to parse JSON data like this:
var baseUrl = 'https://api.themoviedb.org/3/movie/'
var movieID = '550'
var detailUrl = '&append_to_response=releases,trailers,credits&callback=?'
var apiKey = '?api_key=Removed_For_Privacy'
The above url with the api key include returns this result:
?({
"adult": false,
"backdrop_path": "/8uO0gUM8aNqYLs1OsTBQiXu0fEv.jpg",
"belongs_to_collection": null,
"budget": 63000000,
"genres": [
{
"id": 28,
"name": "Action"
},
{
"id": 18,
"name": "Drama"
},
{
"id": 53,
"name": "Thriller"
}
],
"homepage": "",
"id": 550,
"imdb_id": "tt0137523",
"original_title": "Fight Club",
"overview": "A ticking-time-bomb insomniac and a slippery soap salesman channel primal male aggression into a shocking new form of therapy. Their concept catches on, with underground \"fight clubs\" forming in every town, until an eccentric gets in the way and ignites an out-of-control spiral toward oblivion.",
"popularity": "10.2188172784825",
"poster_path": "/2lECpi35Hnbpa4y46JX0aY3AWTy.jpg",
"production_companies": [
{
"name": "20th Century Fox",
"id": 25
},
{
"name": "Fox 2000 Pictures",
"id": 711
},
{
"name": "Regency Enterprises",
"id": 508
}
],
"production_countries": [
{
"iso_3166_1": "DE",
"name": "Germany"
},
{
"iso_3166_1": "US",
"name": "United States of America"
}
],
"release_date": "1999-10-14",
"revenue": 100853753,
"runtime": 139,
"spoken_languages": [
{
"iso_639_1": "en",
"name": "English"
}
],
"status": "Released",
"tagline": "How much can you know about yourself if you've never been in a fight?",
"title": "Fight Club",
"vote_average": 7.6,
"vote_count": 2787,
"releases": {
"countries": [
{
"iso_3166_1": "US",
"certification": "R",
"release_date": "1999-10-14"
},
{
"iso_3166_1": "DE",
"certification": "18",
"release_date": "1999-11-10"
},
{
"iso_3166_1": "GB",
"certification": "18",
"release_date": "1999-11-12"
},
{
"iso_3166_1": "FR",
"certification": "16",
"release_date": "1999-11-10"
},
{
"iso_3166_1": "TR",
"certification": "",
"release_date": "1999-12-10"
},
{
"iso_3166_1": "BR",
"certification": "feibris",
"release_date": "1999-07-12"
},
{
"iso_3166_1": "FI",
"certification": "K-18",
"release_date": "1999-11-12"
},
{
"iso_3166_1": "BG",
"certification": "c",
"release_date": "2012-08-28"
},
{
"iso_3166_1": "IT",
"certification": "VM14",
"release_date": "1999-10-29"
}
]
},
"trailers": {
"quicktime": [],
"youtube": [
{
"name": "Trailer 1",
"size": "HD",
"source": "SUXWAEX2jlg",
"type": "Trailer"
}
]
},
"credits": {
"cast": [
{
"id": 819,
"name": "Edward Norton",
"character": "The Narrator",
"order": 0,
"cast_id": 4,
"profile_path": "/iUiePUAQKN4GY6jorH9m23cbVli.jpg"
},
{
"id": 287,
"name": "Brad Pitt",
"character": "Tyler Durden",
"order": 1,
"cast_id": 5,
"profile_path": "/kc3M04QQAuZ9woUvH3Ju5T7ZqG5.jpg"
},
{
"id": 1283,
"name": "Helena Bonham Carter",
"character": "Marla Singer",
"order": 2,
"cast_id": 6,
"profile_path": "/58oJPFG1wefMC0Vj7sFzHPrm67J.jpg"
},
{
"id": 7470,
"name": "Meat Loaf",
"character": "Robert 'Bob' Paulson",
"order": 3,
"cast_id": 7,
"profile_path": "/pwNyXgegO1nlZ8uWT847JM8EjGj.jpg"
},
{
"id": 7499,
"name": "Jared Leto",
"character": "Angel Face",
"order": 4,
"cast_id": 30,
"profile_path": "/msugySeTCyCmlRWtyB6sMixTQYY.jpg"
},
{
"id": 7471,
"name": "Zach Grenier",
"character": "Richard Chesler",
"order": 5,
"cast_id": 31,
"profile_path": "/jghYiKdNkVehKpiVyE97AWrU9KQ.jpg"
},
{
"id": 7497,
"name": "Holt McCallany",
"character": "The Mechanic",
"order": 6,
"cast_id": 32,
"profile_path": "/hQBfcw9KVszdenlTZTR8AIrSpex.jpg"
},
{
"id": 7498,
"name": "Eion Bailey",
"character": "Ricky",
"order": 7,
"cast_id": 33,
"profile_path": "/4MnRgrwuiJvHsfoiJrIUL4TkfoC.jpg"
}
],
"crew": [
{
"id": 7469,
"name": "Jim Uhls",
"department": "Writing",
"job": "Author",
"profile_path": null
},
{
"id": 7474,
"name": "Ross Grayson Bell",
"department": "Production",
"job": "Producer",
"profile_path": null
},
{
"id": 7475,
"name": "Ceán Chaffin",
"department": "Production",
"job": "Producer",
"profile_path": null
},
{
"id": 1254,
"name": "Art Linson",
"department": "Production",
"job": "Producer",
"profile_path": "/dEtVivCXxQBtIzmJcUNupT1AB4H.jpg"
},
{
"id": 7477,
"name": "John King",
"department": "Sound",
"job": "Original Music Composer",
"profile_path": null
},
{
"id": 7478,
"name": "Michael Simpson",
"department": "Sound",
"job": "Original Music Composer",
"profile_path": null
},
{
"id": 7479,
"name": "Jeff Cronenweth",
"department": "Camera",
"job": "Director of Photography",
"profile_path": null
},
{
"id": 7480,
"name": "James Haygood",
"department": "Editing",
"job": "Editor",
"profile_path": null
},
{
"id": 7481,
"name": "Laray Mayfield",
"department": "Production",
"job": "Casting",
"profile_path": null
},
{
"id": 1303,
"name": "Alex McDowell",
"department": "Art",
"job": "Production Design",
"profile_path": null
},
{
"id": 7763,
"name": "Ren Klyce",
"department": "Sound",
"job": "Sound Editor",
"profile_path": null
},
{
"id": 7764,
"name": "Richard Hymns",
"department": "Sound",
"job": "Sound Editor",
"profile_path": null
},
{
"id": 7467,
"name": "David Fincher",
"department": "Directing",
"job": "Director",
"profile_path": "/dcBHejOsKvzVZVozWJAPzYthb8X.jpg"
},
{
"id": 7468,
"name": "Chuck Palahniuk",
"department": "Writing",
"job": "Novel",
"profile_path": "/8nOJDJ6SqwV2h7PjdLBDTvIxXvx.jpg"
}
]
}
})
I use this to parse it, however i have no luck
$(document).ready(function() {
$.ajax({
url: baseUrl + movieID +apiKey +detailUrl,
dataType: "jsonp",
success: getGenres,
});
});
function getGenres(data) {
var entries = data
genre = 0,
genre_list = '';
for (genre = 0; genre < entries.genres.name.length; genre++) {
genre_list.push(entries.genres.name[genre]);
}
document.getElementById('Genres').innerHTML = genre_list.join(', ');
Please Help
entries.genres is an Array. It has no .name property. You should be getting an error in your browser's developer console for accessing .length of undefined.
{
"adult": false,
"backdrop_path": "/8uO0gUM8aNqYLs1OsTBQiXu0fEv.jpg",
"belongs_to_collection": null,
"budget": 63000000,
"genres": [
{
"id": 28,
"name": "Action"
},
{
"id": 18,
"name": "Drama"
},
{
"id": 53,
"name": "Thriller"
}
],
...
}
So you need to iterate entries.genres, then push the .name of the current genre if that's what you want.
for (genre = 0; genre < entries.genres.length; genre++) {
genre_list.push(entries.genres[genre].name);
}
On a different note, you have two implicit globals.
var entries = data
genre = 0,
genre_list = '';
By forgetting the comma after var entries = data, the next two lines will implicitly create global variables since they're not part of the var statement.
That's why I always use leading commas for variable declarations. Makes it obvious when a comma is missing.
var entries = data
, genre = 0
, genre_list = '';
test.php
<?php
echo 'getGenres({
"adult": false,
"backdrop_path": "/8uO0gUM8aNqYLs1OsTBQiXu0fEv.jpg",
"belongs_to_collection": null,
"budget": 63000000,
"genres": [
{
"id": 28,
"name": "Action"
},
{
"id": 18,
"name": "Drama"
},
{
"id": 53,
"name": "Thriller"
}
],
"homepage": "",
"id": 550,
"imdb_id": "tt0137523",
"original_title": "Fight Club",
"overview": "A ticking-time-bomb insomniac and a slippery soap salesman channel primal male aggression into a shocking new form of therapy. Their concept catches on, with underground \"fight clubs\" forming in every town, until an eccentric gets in the way and ignites an out-of-control spiral toward oblivion.",
"popularity": "10.2188172784825",
"poster_path": "/2lECpi35Hnbpa4y46JX0aY3AWTy.jpg",
"production_companies": [
{
"name": "20th Century Fox",
"id": 25
},
{
"name": "Fox 2000 Pictures",
"id": 711
},
{
"name": "Regency Enterprises",
"id": 508
}
],
"production_countries": [
{
"iso_3166_1": "DE",
"name": "Germany"
},
{
"iso_3166_1": "US",
"name": "United States of America"
}
],
"release_date": "1999-10-14",
"revenue": 100853753,
"runtime": 139,
"spoken_languages": [
{
"iso_639_1": "en",
"name": "English"
}
],
"status": "Released",
"tagline": "How much can you know about yourself if youve never been in a fight?",
"title": "Fight Club",
"vote_average": 7.6,
"vote_count": 2787,
"releases": {
"countries": [
{
"iso_3166_1": "US",
"certification": "R",
"release_date": "1999-10-14"
},
{
"iso_3166_1": "DE",
"certification": "18",
"release_date": "1999-11-10"
},
{
"iso_3166_1": "GB",
"certification": "18",
"release_date": "1999-11-12"
},
{
"iso_3166_1": "FR",
"certification": "16",
"release_date": "1999-11-10"
},
{
"iso_3166_1": "TR",
"certification": "",
"release_date": "1999-12-10"
},
{
"iso_3166_1": "BR",
"certification": "feibris",
"release_date": "1999-07-12"
},
{
"iso_3166_1": "FI",
"certification": "K-18",
"release_date": "1999-11-12"
},
{
"iso_3166_1": "BG",
"certification": "c",
"release_date": "2012-08-28"
},
{
"iso_3166_1": "IT",
"certification": "VM14",
"release_date": "1999-10-29"
}
]
},
"trailers": {
"quicktime": [],
"youtube": [
{
"name": "Trailer 1",
"size": "HD",
"source": "SUXWAEX2jlg",
"type": "Trailer"
}
]
},
"credits": {
"cast": [
{
"id": 819,
"name": "Edward Norton",
"character": "The Narrator",
"order": 0,
"cast_id": 4,
"profile_path": "/iUiePUAQKN4GY6jorH9m23cbVli.jpg"
},
{
"id": 287,
"name": "Brad Pitt",
"character": "Tyler Durden",
"order": 1,
"cast_id": 5,
"profile_path": "/kc3M04QQAuZ9woUvH3Ju5T7ZqG5.jpg"
},
{
"id": 1283,
"name": "Helena Bonham Carter",
"character": "Marla Singer",
"order": 2,
"cast_id": 6,
"profile_path": "/58oJPFG1wefMC0Vj7sFzHPrm67J.jpg"
},
{
"id": 7470,
"name": "Meat Loaf",
"character": "Robert Bob Paulson",
"order": 3,
"cast_id": 7,
"profile_path": "/pwNyXgegO1nlZ8uWT847JM8EjGj.jpg"
},
{
"id": 7499,
"name": "Jared Leto",
"character": "Angel Face",
"order": 4,
"cast_id": 30,
"profile_path": "/msugySeTCyCmlRWtyB6sMixTQYY.jpg"
},
{
"id": 7471,
"name": "Zach Grenier",
"character": "Richard Chesler",
"order": 5,
"cast_id": 31,
"profile_path": "/jghYiKdNkVehKpiVyE97AWrU9KQ.jpg"
},
{
"id": 7497,
"name": "Holt McCallany",
"character": "The Mechanic",
"order": 6,
"cast_id": 32,
"profile_path": "/hQBfcw9KVszdenlTZTR8AIrSpex.jpg"
},
{
"id": 7498,
"name": "Eion Bailey",
"character": "Ricky",
"order": 7,
"cast_id": 33,
"profile_path": "/4MnRgrwuiJvHsfoiJrIUL4TkfoC.jpg"
}
],
"crew": [
{
"id": 7469,
"name": "Jim Uhls",
"department": "Writing",
"job": "Author",
"profile_path": null
},
{
"id": 7474,
"name": "Ross Grayson Bell",
"department": "Production",
"job": "Producer",
"profile_path": null
},
{
"id": 7475,
"name": "Ceán Chaffin",
"department": "Production",
"job": "Producer",
"profile_path": null
},
{
"id": 1254,
"name": "Art Linson",
"department": "Production",
"job": "Producer",
"profile_path": "/dEtVivCXxQBtIzmJcUNupT1AB4H.jpg"
},
{
"id": 7477,
"name": "John King",
"department": "Sound",
"job": "Original Music Composer",
"profile_path": null
},
{
"id": 7478,
"name": "Michael Simpson",
"department": "Sound",
"job": "Original Music Composer",
"profile_path": null
},
{
"id": 7479,
"name": "Jeff Cronenweth",
"department": "Camera",
"job": "Director of Photography",
"profile_path": null
},
{
"id": 7480,
"name": "James Haygood",
"department": "Editing",
"job": "Editor",
"profile_path": null
},
{
"id": 7481,
"name": "Laray Mayfield",
"department": "Production",
"job": "Casting",
"profile_path": null
},
{
"id": 1303,
"name": "Alex McDowell",
"department": "Art",
"job": "Production Design",
"profile_path": null
},
{
"id": 7763,
"name": "Ren Klyce",
"department": "Sound",
"job": "Sound Editor",
"profile_path": null
},
{
"id": 7764,
"name": "Richard Hymns",
"department": "Sound",
"job": "Sound Editor",
"profile_path": null
},
{
"id": 7467,
"name": "David Fincher",
"department": "Directing",
"job": "Director",
"profile_path": "/dcBHejOsKvzVZVozWJAPzYthb8X.jpg"
},
{
"id": 7468,
"name": "Chuck Palahniuk",
"department": "Writing",
"job": "Novel",
"profile_path": "/8nOJDJ6SqwV2h7PjdLBDTvIxXvx.jpg"
}
]
}
})';
exit;
?>
javascript code:
<script language="javascript">
jq(document).ready(function() {
jq.ajax({
url: 'test.php',
dataType: "jsonp",
}); });
function getGenres(data){
alert(data.genres.length);
}
</script>
Your json response contains single quotes (') example 'bob' and you've which are not standard, so replace then by \' and then parse your json response.
For reference check jQuery single quote in JSON response
Remove ?( and ) from the starting and end of json response and also remove ' from them and check
var obj = jQuery.parseJSON( '{"adult":false,"backdrop_path":"/8uO0gUM8aNqYLs1OsTBQiXu0fEv.jpg","belongs_to_collection":null,"budget":63000000,"genres":[{"id":28,"name":"Action"},{"id":18,"name":"Drama"},{"id":53,"name":"Thriller"}],"homepage":"","id":550,"imdb_id":"tt0137523","original_title":"Fight Club","overview":"A ticking-time-bomb insomniac and a slippery soap salesman channel primal male aggression into a shocking new form of therapy. Their concept catches on, with underground fight clubs forming in every town, until an eccentric gets in the way and ignites an out-of-control spiral toward oblivion.","popularity":"10.2188172784825","poster_path":"/2lECpi35Hnbpa4y46JX0aY3AWTy.jpg","production_companies":[{"name":"20th Century Fox","id":25},{"name":"Fox 2000 Pictures","id":711},{"name":"Regency Enterprises","id":508}],"production_countries":[{"iso_3166_1":"DE","name":"Germany"},{"iso_3166_1":"US","name":"United States of America"}],"release_date":"1999-10-14","revenue":100853753,"runtime":139,"spoken_languages":[{"iso_639_1":"en","name":"English"}],"status":"Released","tagline":"How much can you know about yourself if youve never been in a fight?","title":"Fight Club","vote_average":7.6,"vote_count":2787,"releases":{"countries":[{"iso_3166_1":"US","certification":"R","release_date":"1999-10-14"},{"iso_3166_1":"DE","certification":"18","release_date":"1999-11-10"},{"iso_3166_1":"GB","certification":"18","release_date":"1999-11-12"},{"iso_3166_1":"FR","certification":"16","release_date":"1999-11-10"},{"iso_3166_1":"TR","certification":"","release_date":"1999-12-10"},{"iso_3166_1":"BR","certification":"feibris","release_date":"1999-07-12"},{"iso_3166_1":"FI","certification":"K-18","release_date":"1999-11-12"},{"iso_3166_1":"BG","certification":"c","release_date":"2012-08-28"},{"iso_3166_1":"IT","certification":"VM14","release_date":"1999-10-29"}]},"trailers":{"quicktime":[],"youtube":[{"name":"Trailer 1","size":"HD","source":"SUXWAEX2jlg","type":"Trailer"}]},"credits":{"cast":[{"id":819,"name":"Edward Norton","character":"The Narrator","order":0,"cast_id":4,"profile_path":"/iUiePUAQKN4GY6jorH9m23cbVli.jpg"},{"id":287,"name":"Brad Pitt","character":"Tyler Durden","order":1,"cast_id":5,"profile_path":"/kc3M04QQAuZ9woUvH3Ju5T7ZqG5.jpg"},{"id":1283,"name":"Helena Bonham Carter","character":"Marla Singer","order":2,"cast_id":6,"profile_path":"/58oJPFG1wefMC0Vj7sFzHPrm67J.jpg"},{"id":7470,"name":"Meat Loaf","character":"Robert Bob Paulson","order":3,"cast_id":7,"profile_path":"/pwNyXgegO1nlZ8uWT847JM8EjGj.jpg"},{"id":7499,"name":"Jared Leto","character":"Angel Face","order":4,"cast_id":30,"profile_path":"/msugySeTCyCmlRWtyB6sMixTQYY.jpg"},{"id":7471,"name":"Zach Grenier","character":"Richard Chesler","order":5,"cast_id":31,"profile_path":"/jghYiKdNkVehKpiVyE97AWrU9KQ.jpg"},{"id":7497,"name":"Holt McCallany","character":"The Mechanic","order":6,"cast_id":32,"profile_path":"/hQBfcw9KVszdenlTZTR8AIrSpex.jpg"},{"id":7498,"name":"Eion Bailey","character":"Ricky","order":7,"cast_id":33,"profile_path":"/4MnRgrwuiJvHsfoiJrIUL4TkfoC.jpg"}],"crew":[{"id":7469,"name":"Jim Uhls","department":"Writing","job":"Author","profile_path":null},{"id":7474,"name":"Ross Grayson Bell","department":"Production","job":"Producer","profile_path":null},{"id":7475,"name":"Ceán Chaffin","department":"Production","job":"Producer","profile_path":null},{"id":1254,"name":"Art Linson","department":"Production","job":"Producer","profile_path":"/dEtVivCXxQBtIzmJcUNupT1AB4H.jpg"},{"id":7477,"name":"John King","department":"Sound","job":"Original Music Composer","profile_path":null},{"id":7478,"name":"Michael Simpson","department":"Sound","job":"Original Music Composer","profile_path":null},{"id":7479,"name":"Jeff Cronenweth","department":"Camera","job":"Director of Photography","profile_path":null},{"id":7480,"name":"James Haygood","department":"Editing","job":"Editor","profile_path":null},{"id":7481,"name":"Laray Mayfield","department":"Production","job":"Casting","profile_path":null},{"id":1303,"name":"Alex McDowell","department":"Art","job":"Production Design","profile_path":null},{"id":7763,"name":"Ren Klyce","department":"Sound","job":"Sound Editor","profile_path":null},{"id":7764,"name":"Richard Hymns","department":"Sound","job":"Sound Editor","profile_path":null},{"id":7467,"name":"David Fincher","department":"Directing","job":"Director","profile_path":"/dcBHejOsKvzVZVozWJAPzYthb8X.jpg"},{"id":7468,"name":"Chuck Palahniuk","department":"Writing","job":"Novel","profile_path":"/8nOJDJ6SqwV2h7PjdLBDTvIxXvx.jpg"}]}}' );
alert( obj.genres.length );
alert messages showing 3, so your json response is not valid

Categories