如何在 java 中为键值对创建 JSON 数组并在 JQuery 中使用它自动完成以分隔 KEY VALUE

Question

我一直在努力尝试，到处都在寻找这个解决方案，但没有。

我有一个 JSP 页面，它具有 Jquery 自动完成功能。

<body>
    <%
        String ValueRec = request.getParameter("Category");
        String autosuggest = request.getParameter("autosuggest");
        out.println(ValueRec);
        out.println(autosuggest);
    %>
    <form>
        <input type="hidden" id="autosuggest" name="autosuggest" value="N"/>
        <input type="text" name="Category" id="Category" value="" id="CategoryID">
        <script>
            $("#Category").autocomplete({
                delay: 100,
                autoFocus: true,
                selectFirst: true,
                source: 'ProviderSuggest.jsp',
                select: function (event, ui) {
                    $('#autosuggest').val('Y');
                }
            });
        </script>
        <input type="submit" value="Submit"/>
    </form>
</body>

ProviderSuggest.jsp的代码如下：

    <%@page import="java.util.Hashtable"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.HashMap"%>
<%@page import="com.google.gson.Gson"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Iterator"%>
<%@page import="Functions.DBConnections"%>
<%@page import="java.util.List"%>
<%
    String query = request.getParameter("term");
    List<String> CategoryList = new DBConnections().GetCategoryList(query);
    Iterator CatIterator = CategoryList.iterator();
    String JCategory = "";
    Map CategoryMap = new HashMap<>();
    Gson gson = new Gson();
    while (CatIterator.hasNext()) {
        String Category = (String) CatIterator.next();
        String CategoryID = (String) CatIterator.next();
        CategoryMap.put(CategoryID, Category);
        //JCategory = gson.toJson(CategoryMap);
    }
    //System.out.println(CategoryMap);
    JCategory = gson.toJson(CategoryMap);
    System.out.println(JCategory);
    //out.print(JCountry);
    out.print(JCategory);
%>

当我在自动完成字段中键入关键字时，我得到了所需的类别。 ProviderSuggest.jsp 以 json 格式返回数据，如下所述：

{"110":"MRI SCAN","101":"CT SCAN","102":"SONOGRAPHY","103":"X-RAY","104":"PATHOLOGY"}

我正在使用 Google.gson.Gson。

我的要求是当用户键入例如MRI，他应该看到 MRI SCAN、CT SCAN 等类别。我看到了这个，但输入字段的值应该是“110”或“101”等等。所以当我进一步处理数据时，我只发送类别 ID 而不是类别。

如果有人能帮助我提供实现此目的的完整代码，我将非常高兴。我相信我在 JSon 数组创建部分和我们读取 json 数据的 Jquery 部分犯了一些错误。

谢谢。

Answer 1

您可以用这种方式呈现您的自动完成数据。将 categoryid 添加为数据属性，然后在 select 上您将拥有一个具有 data- 标记，并且您可以检索 .data('id') = Category ID。希望能帮助到你。

$("#Category").autocomplete({
  delay: 100,
  autoFocus: true,
  selectFirst: true,
  source: 'ProviderSuggest.jsp',
  select: function (event, ui) {
    $('#autosuggest').val('Y');
  }
}).data('autocomplete')._renderItem = function(ul, item) {
   return $("<li>").data("item.autocomplete", item).append("<a data-id='"+item.CategoryID+"'>" + item.Category + "</a>").appendTo(ul);
};

你的 Java 应该是这样的：目的是要有一个数组，其中键作为 id，另一个键作为值（2 个键）

[{CategoryID :"110",Category:"MRI SCAN"},{CategoryID :"101",Category:"CT SCAN"]}

<%@page import="java.util.Hashtable"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.HashMap"%>
<%@page import="com.google.gson.Gson"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Iterator"%>
<%@page import="Functions.DBConnections"%>
<%@page import="java.util.List"%>
<%
    String query = request.getParameter("term");
    List<String> CategoryList = new DBConnections().GetCategoryList(query);
    Iterator CatIterator = CategoryList.iterator();
    String JCategory = "";
    Map CategoryMap;
    Gson gson = new Gson();
    List autoComplete = new ArrayList();
    while (CatIterator.hasNext()) {
        String Category = (String) CatIterator.next();
        String CategoryID = (String) CatIterator.next();
        CategoryMap = new HashMap<String,String>();
        CategoryMap.put("Category", Category);
        CategoryMap.put("CategoryID", CategoryID);
        //JCategory = gson.toJson(CategoryMap);
        autoComplete.add(CategoryMap);
    }

    JCategory = gson.toJson(autoComplete);
    System.out.println(JCategory);
    //out.print(JCountry);
    out.print(JCategory);
%>

如何在 java 中为键值对创建 JSON 数组并在 JQuery 中使用它自动完成以分隔 KEY VALUE

How to Create JSON Array for Key Value Pair in java and use it in JQuery Autocomplete to to Separate KEY VALUE

java

jquery

json

jsp

gson