以jsp形式自動填充國家文本框與我的表中的數據tbcntry使用jquery

//下面是我的國家的文本框的表單頁我想顯示所有國家與字母開始和自動完成與我的數據庫中的數據與數據使用JSP，JAVA，jQuery的國家以jsp形式自動填充國家文本框與我的表中的數據tbcntry使用jquery

<html> 
<head> 
<link href = "https://code.jquery.com/ui/1.10.4/themes/uilightness/jquery- ui.css"rel = "stylesheet"> 
<script src = "https://code.jquery.com/jquery-1.10.2.js"></script> 
<script src = "https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
<script> 
$(document).ready(function() { 
$('#country').focusin(function() { 
$("#country").autocomplete("List.jsp"); 
}); 
}); 
</script> 
</head> 
<body> 
    <br><br><center> 
     <font face="verdana" size="2"> 
     <font size="4">Java(jsp)/jQuery Autocompleter Example</font> 
     <br><br><br><br> 

     Select Country : 
     <input type="text" id="country" name="country"/> 

     </font> 
    </body> 
</html>

//下面是有連接數據庫頁面的List.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<%@page import="java.sql.*"%> 
<%@page import="java.util.*"%> 

<% 
    try { 
     String s[] = null; 

     Class.forName("com.mysql.jdbc.Driver"); 
     System.out.println("Driver found"); 
     String url = "jdbc:mysql://localhost:protNum/dbName"; 
     String user = ""; 
     String pass = ""; 
     System.out.println("Connected...."); 
     Connection con = (Connection) DriverManager.getConnection(url, user, pass); 
     Statement st = con.createStatement(); 
     ResultSet rs = st.executeQuery("select * from tbctry"); 

     List li = new ArrayList(); 

     while (rs.next()) { 
      li.add(rs.getString(1)); 
     } 

     String[] str = new String[li.size()]; 
     Iterator it = li.iterator(); 

     int i = 0; 
     while (it.hasNext()) { 
      String p = (String) it.next(); 
      str[i] = p; 
      i++; 
     } 

     //jQuery related start 
     String query = (String) request.getParameter("q"); 

     int cnt = 1; 
     for (int j = 0; j < str.length; j++) { 
      if (str[j].toUpperCase().startsWith(query.toUpperCase())) { 
       out.print(str[j] + "\n"); 
       if (cnt >= 5)// 5=How many results have to show while we are typing(auto suggestions) 
       { 
        break; 
       } 
       cnt++; 
      } 
     } 
//jQuery related end 

     rs.close(); 
     st.close(); 
     con.close(); 

    } catch (Exception e) { 
     e.printStackTrace(); 
    } 
%>

來源

2017-01-12 Cimy Riya

而且？你怎麼了？ –

//下面是使用JSON和jQuery 自動完成的執行//Jsp表單頁面用於輸入國家名稱文本框的同時用戶輸入的第一個字母自動填充開始運作

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="ISO-8859-1"> 
     <title>Autocomplete in java web application using Jquery and JSON</title> 
     <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
     <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
     <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
     <script> 
      $(document).ready(function() { 
       $(function() { 
        $("#search").autocomplete({ 
         source: function(request, response) { 
          $.ajax({ 
           url: "CountryListCheck", 
           type: "GET", 
           data: { 
            term: request.term 
           }, 
           dataType: "json", 
           success: function(data) { 
            response(data); 
           } 
          }); 
         } 
        }); 
       }); 
      }); 
     </script> 


    </head> 
    <body> 
     <div class="header"> 
      <h3>Autocomplete in java web application using Jquery and JSON</h3> 
     </div> 
     <br /> 
     <br /> 
     <div class="search-container"> 
      <div class="ui-widget"> 
       country: 
       <input type="text" id="search" name="search" class="search" /> 
      </div> 
     </div> 
    </body> 
</html>

//下面將被放置在對應於URL CountryListCheck控制器的代碼

"/CountryListCheck": 
    String term = request.getParameter("term"); 
    System.out.println("Data from ajax call " + term); 
        ArrayList<String> list = new Op_contact(dcon).getAllCountriesCheck(term); 
        System.out.println(list); 
        Json = new Gson().toJson(list); 
        response.getWriter().write(Json);

//下面是操作類代碼或數據庫查詢部分

public ArrayList<String> getAllCountriesCheck(String l) { 
     ArrayList<String> list = new ArrayList<String>(); 
     PreparedStatement ps = null; 
     String data; 
     try { 
      String ch=l+"%"; 
      ps = (PreparedStatement) dcon.con.prepareStatement("SELECT nicename FROM tbctry WHERE nicename LIKE '"+ch+"'"); 
      ResultSet rs = ps.executeQuery(); 
      while (rs.next()) { 
       data = rs.getString("nicename"); 
       System.out.println(data); 
       list.add(data); 
      } 
     } catch (Exception e) { 
      System.out.println(e.getMessage()); 
     } 
     return list; 
    }

來源

2017-01-12 08:54:22

以jsp形式自動填充國家文本框與我的表中的數據tbcntry使用jquery

回答

相關問題