Rails/JSON:如何将JSON用于jquery UI自动完成表单

Rails/JSON: How to use JSON for jquery UI autocomplete form

本文关键字：JSON UI 表单 jquery 用于 Rails      更新时间：2023-09-26

请注意，这是用于rails应用程序的。我一直在努力寻找从json文件中提取数据的最佳方法，但似乎在任何地方都找不到我想做什么的答案。我有一个静态数据列表，就像这样（这是一个8000行长的列表）：

    [
    {"web_page": "http://www.usjc.uwaterloo.ca/", "country": "Canada", "domain": "usjc.uwaterloo.ca", "name": "University of St. Jerome's College"},
    {"web_page": "http://www.ustanne.ednet.ns.ca/", "country": "Canada", "domain": "ustanne.ednet.ns.ca", "name": "St. Anne University"}
    ]

^^我将以上内容保存在我的apps/assets/javascript文件夹中，作为universitydata.json

我的javascript：

    function updateUniSearch() {
         $("#university-field").autocomplete({
                source: universitydata
            });
    }

这是一个嵌入的ruby文件，在这里我有updateUniSearch（）函数的事件，因为它处于keydown：

    <%= f.text_field :university, :id => "university-field", :onkeydown=>"updateUniSearch()" %>

因此，假设我将universitydata定义为：

   var universitydata = ["Maine", "Harvard"];

然后我在自动完成表单中键入'm'-'Maine"将作为一个选项出现。但在我保存为javascript资产文件夹中的universitydata.json的这个文件中，什么都没有发生。我设置错了吗？我保存这个json文件不正确吗？为什么它只适用于本地数组？提前谢谢。

几件事：

大多数自动完成库要求您只"绑定"输入一次。根据你的堆栈溢出帖子，它发生在onkeydown事件中。因此，每次键入时，都会重新绑定到输入。

考虑一下：

$(document).on('ready', function(){
  $("#university-field").autocomplete({
    source: universitydata
  });
});

这将只绑定自动完成一次（页面加载时）

其次，为了回答您的主要问题，如果您想从文件中加载json数据，您必须发出AJAX请求将其加载到变量中。假设数据是静态的，并且数据集非常小，那么在绑定自动补全器之前将其作为变量加载是完全可以的。将所有这些（数据和自动完成事件绑定）放在.js文件中，然后使用

<script src="/your-path-to-the-javascript.js"></script>

第三，JavaScipt约定建议变量名使用snake大小写，因此请考虑将变量命名为universityData

相关文章：