我一直很努力,已经在各处搜索了此解决方案,但没有。
我有一个具有Jquery自动完成功能的JSP页面。
<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部分犯了一些错误。
谢谢。
您可以通过这种方式呈现自动完成数据。将categoryid添加为数据属性,然后选择时,将具有一个具有data- tag的标签,然后可以检索.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为id,另一个key为value(2个key)
[{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); %>