Google EXCEL當資料庫讀取

跟工作相關並紀錄一下
又學到的新技能

HTML部分

<table>
<tr>
<th>驅動名稱</th>
<th>PN</th>
</tr>
    <tbody id="producttable">
    </tbody>
</table>

<select id="shopList2">
  <option></option>
</select>

<select size=5 multiple id="shopList">
     <option></option>
    </select>

multiple  > 讓下拉式選單變成多選


JAVASCRIPT部分


<script src="/jquery/jquery-1.11.1.min.js">
</script>

<script>
var Name = ["commonuse", "nfl10", "nfl11", "bk10hb11", "msl11", "lrw10", "lrw11"];
var myselect2=document.getElementById("shopList2")
 for (var j=0; j < 7; j++){
           myselect2.add(new Option(Name[j], Name[j]), myselect2.options[0])
        }
</script>

<script>

$(function(){
    var ProductName = [];
    var Price = [];
    var myselect=document.getElementById("shopList")
    $.getJSON('https://spreadsheets.google.com/feeds/list/11yf-2-AbHuG4bOf2ZC0tYxYwp8l1hbXQ3JKaVesqX1U/2/public/values?alt=json', function (data){
        for (var i=0; i < data.feed.entry.length; i++){
            ProductName[i] = data.feed.entry[i].gsx$nfl10.$t;
            Price[i] = data.feed.entry[i].gsx$pn.$t;
            $('#producttable').append("<tr><td>" + ProductName[i] + "</td><td>" + Price[i] + "</td></tr>");
            myselect.add(new Option(ProductName[i], ProductName[i]), myselect.options[0])
        }
    });
});

</script>

$('#producttable').append > table

myselect.add > 動態下拉式選單

myselect.add(new Option("選項名", "值"), myselect.options[第幾個選項])


表單轉JSON
https://spreadsheets.google.com/feeds/list/文件ID/第幾個工作表/public/values?alt=json



用法來源 : 

1. 表單轉JSON : https://goo.gl/h4oskR + https://goo.gl/zw9jLb + 自己研究
2. SELECT : https://goo.gl/uqM6lS