讀取GoogleSheet資料，並透過範本排版

讀取Googe Sheet的JSON資料，並透過JQuery.tmpl範本來進行排版。

	<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
	<script src='http://web2.systemlead.com/iticket/scripts/jquery.tmpl.js'></script>
	<script id="myTemplate" type="text/x-jquery-tmpl">
	<li class='product-div-wrap>
	<div class='product-div'>${getColumData($data,'相關連結')} ${getColumData($data,'專案名稱')}</div>
	</li>
	</script>
	<script>
	$(function(){
	});
	function showsheetfeedcontent(data){
	try{
	$('#myTemplate').tmpl(data.feed.entry, {
	getTags: function (separator) {
	return this.data.tags.join(separator);
	}
	}).appendTo($('#portfoliolist'));
	}
	catch(err){alert(err);}
	}
	function getColumData(item,colName)
	{
	var result='nodata';
	var searchStr = 'gsx$'+colName;
	$.each(item, function (ii, iitem) {
	if (ii.indexOf(searchStr ) > -1)
	result= iitem.$t;
	});
	return result;
	}
	</script>
	<div id='portfoliolist'>
	</div>
	<!--google表單統計-->
	<script type="text/javascript" src="https://spreadsheets.google.com/feeds/list/1cRGyaNQq0mUlSgTRmWKEXeFRID_tmATEe28h0Tno2cY/od6/public/full?alt=json-in-script&amp;callback=showsheetfeedcontent"></script>

view raw showGoogleSheetJson.html hosted with ❤ by GitHub

結果

補充：Google Sheet須發佈到網路，才可以使用JSON。