Multi Checkbox Filter in Angularjs - javascript

Need to solve Multi checkbox filter for Search Module With All Results
Here is the working Code for Search with one checkbox
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
var json = {
"modules": [{
"myid": "70",
"realname": "Kishore",
"full_name": "Kishore Chandra",
"category": "professional",
"firm_name": "Yes",
"designation": "Design-Build Firm",
"address": "Dwarakanagar 5th lane"
}, {
"myid": "75",
"realname": "Vinod kumar",
"full_name": "Kishore Chandra",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "76",
"realname": "Pradeep Reddy",
"full_name": "PRADEEP REDDY",
"category": "professional",
"firm_name": "",
"designation": "Civil Engineer",
"address": "Visakapatnam, Andhra Pradesh, India"
}, {
"myid": "78",
"realname": "Pradeep Raju",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "79",
"realname": "Pradeep kumar",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "80",
"realname": "Pradeep",
"full_name": "Pradeep",
"category": "professional",
"firm_name": "",
"designation": "Architect",
"address": "Akkayapalem"
}, {
"myid": "81",
"realname": "Pradeep",
"full_name": "Pradeep Reddy ",
"category": "professional",
"firm_name": "",
"designation": "Civil Engineer",
"address": "Jubliee Hills"
}, {
"myid": "82",
"realname": "krishna",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "83",
"realname": "raghu",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "84",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "85",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "86",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "87",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "88",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "89",
"realname": "Pradeep",
"full_name": "",
"category": "professional",
"firm_name": "",
"designation": null,
"address": null
}, {
"myid": "72",
"realname": "recobee",
"full_name": "Kishore Chandra",
"category": "vendor",
"firm_name": "Recobee",
"designation": "Hardware",
"address": "55-2-27\/1, Old Venkojipalem, Near Andhra Bank, Hb Colony Road"
}, {
"myid": "90",
"realname": "Vinod kumar",
"full_name": "Tiles Vendor",
"category": "vendor",
"firm_name": "Vendor1",
"designation": "Tiles",
"address": "akkayapalem, "
}, {
"myid": "92",
"realname": "Vamsi Vytla",
"full_name": "vamsi vytla",
"category": "vendor",
"firm_name": "vytla cements",
"designation": "Cement Suppliers",
"address": "akkayapalem"
}, {
"myid": "93",
"realname": "Bhaskar",
"full_name": "Surya Bhaskar",
"category": "vendor",
"firm_name": "Talatam",
"designation": "Doors and Windows",
"address": "Hitech city"
}, {
"myid": "94",
"realname": "Naren",
"full_name": "Naren Mandala",
"category": "vendor",
"firm_name": "Mandala Hardwares",
"designation": "Hardware",
"address": "Malleshwaram road"
}, {
"myid": "95",
"realname": "Sreetej",
"full_name": "Sreetej Vincent",
"category": "vendor",
"firm_name": "Vincent Paints",
"designation": "Paintings",
"address": "Navi Mumbai"
}, {
"myid": "96",
"realname": "Raja",
"full_name": "Ramesh Raja Galla",
"category": "vendor",
"firm_name": "Galla plumbing ",
"designation": "Plumbing & Bathware",
"address": "Karol Bagh "
}, {
"myid": "97",
"realname": "Prasanna kumar",
"full_name": "Prasanna kumar",
"category": "vendor",
"firm_name": "JP cement",
"designation": "Cement Suppliers",
"address": "poonamalle road"
}, {
"myid": "98",
"realname": "Phalgun",
"full_name": "Phalgun Moturu",
"category": "vendor",
"firm_name": "Moturu Tiles",
"designation": "Tiles",
"address": "benz circle"
}, {
"myid": "99",
"realname": "Pavan",
"full_name": "Pavan kumar",
"category": "vendor",
"firm_name": "Pavan Constructions",
"designation": "Cement Suppliers",
"address": "Jubliee hills"
}]
};
$scope.ocw = json;
var allCategories = json.modules.map(function(item) {
return item.designation
});
var filteredCategories = [];
allCategories.forEach(function(item) {
if (filteredCategories.indexOf(item) < 0 && item) {
filteredCategories.push(item);
}
});
$scope.search = {
designation: ""
}
$scope.categories = filteredCategories;
$scope.isFiltered = function(val) {
return $scope.search.designations[val.designation];
}
});
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js#1.3.x" src="https://code.angularjs.org/1.3.15/angular.js" data-semver="1.3.15"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<form>
<div ng-repeat="designation in categories">
<input type="checkbox" ng-model="search.designations[designation]"> {{designation}}
</div>
Full name: <input type="text" ng-model="search.full_name">
</form>
<table class="table table-bordered" ng-repeat="module in ocw.modules | filter:isFiltered | filter:{full_name:search.full_name}">
<tr>
<td>
<h3 class="moduletitle">Name : {{ module.realname }}</h3>
<p>Designation : {{ module.designation }}</p>
<p>Category : {{ module.category }}</p>
<p>Fullname : {{ module.full_name }}</p>
</td>
</tr>
</table>
</body>
</html>
Working Code But Need All Results Before Filtering
http://plnkr.co/edit/QNS5iX3atZ8C7lrG1gyU?p=preview

Related

How to update a field inside the array of object of another array of objects in mongo db? or How to update a field using the array index in mongo db?

This is the structure of my collection of mongodb database. I need to update the status inside each order products. What I need to do?
{
"_id": {
"$oid": "633ab3c11e6e97b6332f56a1"
},
"orders": [
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 1,
"status": "placed"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "placed"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
},
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 3,
"status": "placed"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "placed"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
},
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Shirt",
"price": "234",
"quantity": 1,
"status": "placed"
},
"1": {
"name": "Top",
"price": "123",
"quantity": 1,
"status": "placed"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
}
]
}
I want to update the order product status to shipped, canceled, etc. I have to set status in desired position like the following.
I waant to update the mongodb databse and have to get the result in like the following result.
{
"_id": {
"$oid": "633ab3c11e6e97b6332f56a1"
},
"orders": [
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 1,
"status": "caneled"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "shipped"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
},
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 3,
"status": "canceled"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "shipped"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
},
{
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Shirt",
"price": "234",
"quantity": 1,
"status": "placed"
},
"1": {
"name": "Top",
"price": "123",
"quantity": 1,
"status": "shipped"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
}
]
}
According to my research, the correct method is as follows:
db.orders.updateOne({_id: ObjectId("633a6a73dd9f8cce0029e53d")},{$set:{"orders.0.productDetails.0.status": "shipped"}})
And the result is :-
{
"_id": {
"$oid": "633ab3c11e6e97b6332f56a1"
},
"orders": [
{
"_id": {
"$oid": "633e8f2d3e3f12f07438cc64"
},
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 1,
"status": "shipped"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "placed"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
},
{
"_id": {
"$oid": "633e96533e3f12f07438cc65"
},
"date": "6/10/2022",
"productDetails": {
"0": {
"name": "Top",
"price": "1235",
"quantity": 1,
"status": "placed"
},
"1": {
"name": "Shirt",
"price": "1235",
"quantity": 1,
"status": "placed"
},
"2": {
"name": "Jeans",
"price": "1234",
"quantity": 1,
"status": "placed"
}
},
"billingAddress": {
"address": "My Address",
"city": "City",
"state": "State",
"country": "Country",
"pincode": "123456",
"contact": "1234567890"
},
"paymentMode": "cod"
}
]
}

response.map() is not a function in reactjs

Hi I am calling an API using axios. it is returning data. that data I am using to populate a table. but it is giving error.
const [response, setResponse] = useState([]);
const [flag, setFlag] = useState(false);
await axios.get(`http://localhost:3000/api/certificates?page=${page}`,{
params: param,
}).then(res=>{
console.log(res.data);
setResponse(res.data);
setFlag(true);
})
then I am using response into table to populate data. table will be populated only if flag become true.
<div className="col-md-10 container">
{ flag && (
<table className="table table-bordered ">
<tbody>
{ flag && response.map((certificate: Certificate, index: number) => (
<tr>
<td>{certificate.certifcateNo}</td>
<td>{certificate.protoCOlNo}</td>
</tr>
}
</tbody>
</table>
</div>
My API is returning below output from postman
{
"data": [
{
"id": "cace4b0c-2836-412a-be60-78f726917ff6",
"createdAt": "2021-12-03T21:06:14.540Z",
"modifiedAt": "2021-12-03T21:06:14.540Z",
"deletedAt": null,
"certificateNo": 1,
"requestStatus": "DRAFT",
"sponser": "Onkar",
"address": "JBP",
"address2": "BUSINESS BAY",
"zipCode": "40013",
"city": "MH",
"protoColNo": "123",
"molecules": "Shweta",
"unAuthMolecule": "NO",
"phaseOfTrial": 1,
"noOfSubjects": "5",
"startDate": "2011-11-09",
"endDate": "2012-11-09",
"personInCharge": "Deepali",
"country": "India",
"comments": "I am Genius",
"attachedFile": "string"
},
{
"id": "91dfa4e3-d7f7-4671-b3e3-ba90c6454a1a",
"createdAt": "2021-12-03T21:06:22.690Z",
"modifiedAt": "2021-12-03T21:06:22.690Z",
"deletedAt": null,
"certificateNo": 2,
"requestStatus": "DRAFT",
"sponser": "Onkar",
"address": "JBP",
"address2": "BUSINESS BAY",
"zipCode": "40013",
"city": "MH",
"protoColNo": "123",
"molecules": "Shweta",
"unAuthMolecule": "NO",
"phaseOfTrial": 1,
"noOfSubjects": "5",
"startDate": "2011-11-09",
"endDate": "2012-11-09",
"personInCharge": "Deepali",
"country": "India",
"comments": "I am Genius",
"attachedFile": "string"
},
{
"id": "c84d7bce-cdcb-4984-89a2-ad2291651867",
"createdAt": "2021-12-03T21:06:23.398Z",
"modifiedAt": "2021-12-03T21:06:23.398Z",
"deletedAt": null,
"certificateNo": 3,
"requestStatus": "DRAFT",
"sponser": "Onkar",
"address": "JBP",
"address2": "BUSINESS BAY",
"zipCode": "40013",
"city": "MH",
"protoColNo": "123",
"molecules": "Shweta",
"unAuthMolecule": "NO",
"phaseOfTrial": 1,
"noOfSubjects": "5",
"startDate": "2011-11-09",
"endDate": "2012-11-09",
"personInCharge": "Deepali",
"country": "India",
"comments": "I am Genius",
"attachedFile": "string"
},
{
"id": "0755d2f9-50df-4b5a-a863-d173a12b45b5",
"createdAt": "2021-12-03T21:06:23.762Z",
"modifiedAt": "2021-12-03T21:06:23.762Z",
"deletedAt": null,
"certificateNo": 4,
"requestStatus": "DRAFT",
"sponser": "Onkar",
"address": "JBP",
"address2": "BUSINESS BAY",
"zipCode": "40013",
"city": "MH",
"protoColNo": "123",
"molecules": "Shweta",
"unAuthMolecule": "NO",
"phaseOfTrial": 1,
"noOfSubjects": "5",
"startDate": "2011-11-09",
"endDate": "2012-11-09",
"personInCharge": "Deepali",
"country": "India",
"comments": "I am Genius",
"attachedFile": "string"
},
{
"id": "05c1ce23-eaf6-4ff9-aa5c-5f0554a22205",
"createdAt": "2021-12-03T21:06:24.032Z",
"modifiedAt": "2021-12-03T21:06:24.032Z",
"deletedAt": null,
"certificateNo": 5,
"requestStatus": "DRAFT",
"sponser": "Onkar",
"address": "JBP",
"address2": "BUSINESS BAY",
"zipCode": "40013",
"city": "MH",
"protoColNo": "123",
"molecules": "Shweta",
"unAuthMolecule": "NO",
"phaseOfTrial": 1,
"noOfSubjects": "5",
"startDate": "2011-11-09",
"endDate": "2012-11-09",
"personInCharge": "Deepali",
"country": "India",
"comments": "I am Genius",
"attachedFile": "string"
}
],
"meta": {
"total": 16,
"page": "1",
"last_page": 4
}
}
what mistake I am doing?
Idk if you just wrote your code too quickly, but you are missing closing parentheses.
{ flag && response.map((certificate: Certificate, index: number) => (
<tr>
<td>{certificate.certifcateNo}</td>
<td>{certificate.protoCOlNo}</td>
</tr>
))} <-- here
const {data} = await axios.get(`http://localhost:3000/api/certificates?page=${page}`,{
params: param,
})
console.log(data.data);
setResponse(data.data);
setFlag(true);

item_option_selection - Where to put in the json request?

I see in the documentation that there's a way to set item options: https://developer.paypal.com/docs/api/payments/#definition-item_option_selection
Where do i exactly put this in paypal example? I don't find examples or any instruction on paypal developers documentation
{
"intent": "sale",
"payer": {
"payment_method": "paypal"
},
"transactions": [
{
"amount": {
"total": "30.11",
"currency": "USD",
"details": {
"subtotal": "30.00",
"tax": "0.07",
"shipping": "0.03",
"handling_fee": "1.00",
"shipping_discount": "-1.00",
"insurance": "0.01"
}
},
"description": "The payment transaction description.",
"custom": "EBAY_EMS_90048630024435",
"invoice_number": "48787589673",
"payment_options": {
"allowed_payment_method": "INSTANT_FUNDING_SOURCE"
},
"soft_descriptor": "ECHI5786786",
"item_list": {
"items": [
{
"name": "hat",
"description": "Brown hat.",
"quantity": "5",
"price": "3",
"tax": "0.01",
"sku": "1",
"currency": "USD"
},
{
"name": "handbag",
"description": "Black handbag.",
"quantity": "1",
"price": "15",
"tax": "0.02",
"sku": "product34",
"currency": "USD"
}
],
"shipping_address": {
"recipient_name": "Brian Robinson",
"line1": "4th Floor",
"line2": "Unit #34",
"city": "San Jose",
"country_code": "US",
"postal_code": "95131",
"phone": "011862212345678",
"state": "CA"
}
}
}
],
"note_to_payer": "Contact us for any questions on your order.",
"redirect_urls": {
"return_url": "https://www.paypal.com/return",
"cancel_url": "https://www.paypal.com/cancel"
}
}'
The object is not part of the Paypal REST api anymore. It will be removed soon
Reference: https://github.com/paypal/PayPal-REST-API-issues/issues/137

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

Javascript & Nested JSON issues

So I'm trying to put together some JSON and parse it out into jquery but I am doing something wrong with my JSON syntax. I tried running it through a validator but it doesn't really tell me what I'm doing wrong. Can somebody point out the error of my ways?
var searchresults = [
{
"providerlisting": [
{
"nametitle": "Cory M Spears, MD, FACP",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "289 N. Highland Ave.",
"address2": "",
"cityStateZip": "Atlanta, GA 30306",
"coverage": "/images/example.png",
"status": "Out of Network",
"psn": "",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
},
{
"nametitle": "Jimmy Dean, MD, FACP",
"caretype": "External Medicine",
"preferredProvider": false,
"address1": "3 Piedmont Rd.",
"address2": "",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "In Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
},
{
"nametitle": "John Doe, DD, PM",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "500 Ponce De Leon Ave",
"address2": "Suite 5",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "Out of Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
}]
},
{
"categories": [{
"categoryMenu": [
{
"providertype": [
{
"title": "Doctor",
"link": "#doctor",
"amount": "400"
},
{
"title": "Hospital",
"link": "#hospital",
"amount": "40"
},
{
"title": "Urgent Care",
"link": "#urgentCare",
"amount": "37"
}
]
},
{
"specialty": [
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "2"
},
{
"title": "Audiology",
"link": "#audiology",
"amount": "3"
},
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "6"
},
{
"title": "Ambulatory Surgical Center",
"link": "#ambulatorySurgicalCenter",
"amount": "4"
}
]
},
{
"gender": [
{
"title": "Male",
"link": "#male",
"amount": "67"
},
{
"title": "Female",
"link": "#female",
"amount": "3"
}
]
}
}]
}];
Remove the , at the end of each
"rating": "urlhere"
there was a ] missing on the third last line, below is a valid json object
var searchresults = [{
"providerlisting": [{
"nametitle": "Cory M Spears, MD, FACP",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "289 N. Highland Ave.",
"address2": "",
"cityStateZip": "Atlanta, GA 30306",
"coverage": "/images/example.png",
"status": "Out of Network",
"psn": "",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
}, {
"nametitle": "Jimmy Dean, MD, FACP",
"caretype": "External Medicine",
"preferredProvider": false,
"address1": "3 Piedmont Rd.",
"address2": "",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "In Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
}, {
"nametitle": "John Doe, DD, PM",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "500 Ponce De Leon Ave",
"address2": "Suite 5",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "Out of Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
}]
}, {
"categories": [{
"categoryMenu": [{
"providertype": [{
"title": "Doctor",
"link": "#doctor",
"amount": "400"
}, {
"title": "Hospital",
"link": "#hospital",
"amount": "40"
}, {
"title": "Urgent Care",
"link": "#urgentCare",
"amount": "37"
}]
}, {
"specialty": [{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "2"
}, {
"title": "Audiology",
"link": "#audiology",
"amount": "3"
}, {
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "6"
}, {
"title": "Ambulatory Surgical Center",
"link": "#ambulatorySurgicalCenter",
"amount": "4"
}]
}, {
"gender": [{
"title": "Male",
"link": "#male",
"amount": "67"
}, {
"title": "Female",
"link": "#female",
"amount": "3"
}]
}]
}]
}];
There are only , commas after a key/value pairs in objects if there is another one following it. (Same goes for Arrays as well)
For example:
var a = {
key : 'value',
keyB : 'value' // <-- there is no trailing comma before an object ends
};
Do you know http://jsonlint.com/?
You have to realise, an object in javascript is nearly the same like an associative array.
I think you should read a bit more about Objects and Arrays in Javascript.
Try this:
var searchresults = {
"providerlisting": [
{
"nametitle": "Cory M Spears, MD, FACP",
"caretype": "Internaenter code herel Medicine",
"preferredProvider": true,
"address1": "289 N. Highland Ave.",
"address2": "",
"cityStateZip": "Atlanta, GA 30306",
"coverage": "/images/example.png",
"status": "Out of Network",
"psn": "",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
},
{
"nametitle": "Jimmy Dean, MD, FACP",
"caretype": "External Medicine",
"preferredProvider": false,
"address1": "3 Piedmont Rd.",
"address2": "",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "In Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
},
{
"nametitle": "John Doe, DD, PM",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "500 Ponce De Leon Ave",
"address2": "Suite 5",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "Out of Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere"
}
],
"categories": {
"categoryMenu": {
"providertype": [
{
"title": "Doctor",
"link": "#doctor",
"amount": "400"
},
{
"title": "Hospital",
"link": "#hospital",
"amount": "40"
},
{
"title": "Urgent Care",
"link": "#urgentCare",
"amount": "37"
}
],
"specialty": [
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "2"
},
{
"title": "Audiology",
"link": "#audiology",
"amount": "3"
},
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "6"
},
{
"title": "Ambulatory Surgical Center",
"link": "#ambulatorySurgicalCenter",
"amount": "4"
}
],
"gender": [
{
"title": "Male",
"link": "#male",
"amount": "67"
},
{
"title": "Female",
"link": "#female",
"amount": "3"
}
]
}
}
}
Please find the corrected Json string
var searchresults = [
{
"providerlisting": [
{
"nametitle": "Cory M Spears, MD, FACP",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "289 N. Highland Ave.",
"address2": "",
"cityStateZip": "Atlanta, GA 30306",
"coverage": "/images/example.png",
"status": "Out of Network",
"psn": "",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
},
{
"nametitle": "Jimmy Dean, MD, FACP",
"caretype": "External Medicine",
"preferredProvider": false,
"address1": "3 Piedmont Rd.",
"address2": "",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "In Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
},
{
"nametitle": "John Doe, DD, PM",
"caretype": "Internal Medicine",
"preferredProvider": true,
"address1": "500 Ponce De Leon Ave",
"address2": "Suite 5",
"cityStateZip": "Atlanta, GA 30706",
"coverage": "/images/example2.png",
"status": "Out of Network",
"psn": "urlhere",
"dcontact": "urlhere",
"save": "urlhere",
"rating": "urlhere",
}]
},
{
"categories": [{
"categoryMenu": [
{
"providertype": [
{
"title": "Doctor",
"link": "#doctor",
"amount": "400"
},
{
"title": "Hospital",
"link": "#hospital",
"amount": "40"
},
{
"title": "Urgent Care",
"link": "#urgentCare",
"amount": "37"
}
]
},
{
"specialty": [
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "2"
},
{
"title": "Audiology",
"link": "#audiology",
"amount": "3"
},
{
"title": "Allergy and Immunology",
"link": "#allergyAndImmunology",
"amount": "6"
},
{
"title": "Ambulatory Surgical Center",
"link": "#ambulatorySurgicalCenter",
"amount": "4"
}
]
},
{
"gender": [
{
"title": "Male",
"link": "#male",
"amount": "67"
},
{
"title": "Female",
"link": "#female",
"amount": "3"
}
]
}
]
}]
}];
alert(JSON.stringify(searchresults))

Categories