Question

我使用ajax

创建了autocomplete.jsp

enter code here

<%@page import="java.sql.*"%>
<%@page import="autocomplete.DummyDB"%>
<html>
<head>  
<script language="javascript" type="text/javascript">  
  var xmlHttp;   
 var xmlHttp;
  function showState(str){ 
  if (typeof XMLHttpRequest != "undefined"){
 xmlHttp= new XMLHttpRequest();
    }
   else if (window.ActiveXObject){
  xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
   }
 if (xmlHttp==null){
 alert ("Browser does not support XMLHTTP Request");
return
 } 
    var url="auto.jsp";
      //var url="src/autocomplete/DummyDB.java";
     url += "?name=" +str;

  xmlHttp.onreadystatechange = stateChange;
 xmlHttp.open("GET", url, true);
      xmlHttp.send(null);
}
 function stateChange(){   
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){   
  document.getElementById("acc_code").innerHTML=xmlHttp.responseText;  
   }   
 }   
       </script>  
    </head>  
     <body>  
       <input id="name" type="text" name="name" onkeyup="showState(this.value)">
      <br>  
       <div id='acc_code'>  Enter Name Here :
    </div>  
 </body> 
     </html>

并重定向到auto.jsp

    <%@ page import="java.sql.*" %> 
    <%@ page import = "java.io.*"%>
<%
 String name = request.getParameter("name").toString();
 String buffer="<div>";  
 try{
       Class.forName("oracle.jdbc.OracleDriver");
       Connection con =  DriverManager.getConnection("jdbc:oracle:thin:@192.168.1.10:1521:xe", "system", "info123");
       Statement st=con.createStatement();
       ResultSet rs=st.executeQuery("select APPLICANT_NAME from     SHARES.GOA_MEMBER_MASTER where APPLICANT_NAME like '"+name+"%'");
while(rs.next())
{
     buffer=buffer+rs.getString("APPLICANT_NAME")+"<br>";
    }
    buffer=buffer+"</div>";  
   response.getWriter().println(buffer);

 }
     catch (Exception e) {
     System.out.println(e);
    }
  %>

它正在工作......它显示了结果，即它在表单上显示名称。但是我不能选择或滚动列表，它没用。请帮帮我。

Answer 1

您是否尝试过使用jQuery？

我被困在这样的问题上一段时间了，使用jQuery的解决方案让答案变得如此简单！

如果您将所有名称加载到json数组中，jQuery将为您管理自动完成，这是我最近为项目完成的一些简单代码的示例。为了确保我的所有数据都已编码，我将此JavaScript代码放入document.ready函数中。 选择：可让您对所选项目执行某些操作。

    var availableTags = ${jsonArray};
    var ids = ${idArray};
    $( "#autocomplete" ).autocomplete({
            source: availableTags,
            select: function(event,ui) {
            var b = ui.item.value;
            var ind = availableTags.indexOf(b);
            params.filterBranch = ids[ind];
            requestPost(params, '/dashboard');
        }
   });

以下是链接http://jqueryui.com/autocomplete/

jsp中的ajax自动完成文本框

1 个答案: