使用 javascript 进行 Google 电子表格搜索

Question

我正在尝试构建一个搜索选项，用户将在其中输入他们的 ID，他们将看到存储在 google 电子表格中的相应 ID 的结果。

就像用户会输入： 1 他们会看到结果：Nitu 5 他们会看到结果：Dipon

<input id="id" type="text" placeholder="Your ID">
<input id="search" type="submit" value="Search">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
  function displayContent(json) {
		 var string = "<table>";      
            var len = json.feed.entry.length;
            for (var i=0; i<len; i++) {
                  var id = json.feed.entry[i].gsx$id.$t;
                  var name = json.feed.entry[i].gsx$name.$t;
				  string += '<tr><td>' + id + '</td><td>' + name + '</td></tr>';
            }
			string += "</table>";
			$(string).appendTo('body');
        }   
		</script>
<script src="http://spreadsheets.google.com/feeds/list/1WMvFqepPmQUVwTFFUZW_3SfSt1ZBr_AEy_XdUXZ72ng/od6/public/values?alt=json-in-script&amp;callback=displayContent" type="text/javascript"></script>

我可以使用上面的代码 sn-p 从我的谷歌表中获取数据。但我不想一次获取所有数据。我只想要基于 ID 搜索的特定数据。

那么现在我该如何在 javascript 中集成这个搜索功能呢？

Answer 1

您可以将Structured Query 用于 Google 电子表格 API。

因此，如果使用适当的结构化查询发出GET 请求，您将仅获得相关数据。在您的情况下，添加 sq=id==5 作为查询参数。

因此，与其获取整个数据并在之后对其进行解析，不如创建一个函数，该函数将发出正确的GET 请求并仅获取您需要的数据。

var fetchName = function(ID, workSheetID){
    var url = 'https://spreadsheets.google.com/feeds/list/'+workSheetID+'/od6/public/values?sq=id='+ID+'&alt=json-in-script&callback=?';

    $.get( url, function( data ) {
          //Parse and Do Your Stuff Here
    });
}

Plunker Sample

希望这会有所帮助。干杯！！

Answer 2

不用进行 for 循环，只需使用 filter 过滤相应的 ID。例如：

 function displayContent(json) {
    var output = json.feed.entry.filter(function(name){
      return name.gsx$id.$t === '2'

    })
            $('body').append(" <p>" + output[0].gsx$name.$t + "</p>");

这是编辑后的版本，只需将 '2' 替换为您的 id 或输入值 getter，它应该可以工作。请注意，您需要像语法一样引用数组中的输出。 fiddle

Answer 3

用仔细提供的答案交叉引用您的代码！

1) 你的过滤器：--> return element.gsx$id.$t === 2 比较可能不会返回预期结果 --> 返回名称.gsx$id.$t === '2'

2) 如果您的比较产生任何结果，则返回的数据将在变量“名称”中。 var name 在一个数组中。您将使用索引来访问数组元素。因此，考虑到这一点，您应该将代码更改为： var test = name[0].gsx$id.$t; 在这里，您可以正确访问返回的数据。

3) 始终确保有数据可供访问。 如果您尝试访问它，您的数组不能为空。