Javascript - Display videoID using Youtube Data API -
trying work through program have, unable view videoid search query.
have following code @ moment:
function makerequest() { var q = $('#query').val(); var request = gapi.client.youtube.search.list({ q: q, part: 'snippet', maxresults: 20 }); } request.execute(function(response) { $('#results').empty() var srchitems = response.result.items; $.each(srchitems, function(index, item){ vidtitle = item.snippet.title; vidthumburl = item.snippet.thumbnails.default.url; vidthumbimg = '<pre><img id="thumb" src="' + vidthumburl + '" alt="no image available." style="width:102px;height:64px"></pre>'; vidid = item.id.videoid; $('#results').append('<pre>' + vidtitle + vidthumbimg + vidid+ '</pre>'); }) }) looking @ last 2 substantial lines, thought code enough display videoid plain text, however, not working.
advice on how display videoid appreciated.
as additional information, try using sample code provided google.
here code post (made adjustment):
<!doctype html> <html> <head> <title>search</title> </head> <body> <div id="buttons"> <label> <input id="query" value='cats' type="text"/><button id="search-button" onclick="keywordsearch()">search</button></label> <div id="container"> <h1>search results</h1> <ul id="results"></ul> </div> <script> function keywordsearch(){ gapi.client.setapikey('api_key'); gapi.client.load('youtube', 'v3', function() { makerequest(); }); } function makerequest() { var q = $('#query').val(); var request = gapi.client.youtube.search.list({ q: q, part: 'snippet', maxresults: 10 }); request.execute(function(response) { $('#results').empty() var srchitems = response.result.items; $.each(srchitems, function(index, item) { vidtitle = item.snippet.title; vidthumburl = item.snippet.thumbnails.default.url; vidid = "video id : " + item.id.videoid vidthumbimg = '<pre><img id="thumb" src="'+vidthumburl+'" alt="no image available." style="width:204px;height:128px"></pre>'; $('#results').append('<pre>' + vidtitle + vidthumbimg + vidid +'</pre>'); }) }) } </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script src="https://apis.google.com/js/client.js?onload=googleapiclientready"> </script> </body> </html> result:
hope helps.
Comments
Post a Comment