2016-03-27 3 views
2

データベースから項目を検索する自動捜索検索ボックスが必要です。データベースの列のドロップダウンリストを提供する列をユーザーが選択する機能があります。もう1つの列を選択すると、最初に選択した列と2番目に選択した列の両方を検索します。 私はそうではありません。それから私を外してください ここはコードです。それはmvcデザインパターンを持っています。
Index.htmlと
ドロップダウンリストでデータベースの列を選択して自動募集検索ボックスを呼び出す

<script type="text/javascript"> 
    $(function(){ 
    $("#country").autocomplete("find.me", { 
      extraParams: { 
      choice: function() { 
       return $("#searchby").val(); 
      } 
      } 
     }); 
}); 
    </script> 
     <div> 


Search By: 
    <select name="searchby" id="searchby" > 
    <option disabled selected value> -- select an option -- </option> 
    <option value="name">Name</option> 
    <option value="roll_no">Roll No</option> 
    <option value="city">City</option> 
     <option value="pin_code">Pin Code</option> 
     <option value="state">State</option> 
     <option value="country">Country</option> 
     </select> 
    </div> 
     <span class="input input--nariko"> 

      <input id="country" class="input__field input__field--nariko" type="text" id="input-20" name="country" /> 
      <label class="input__label input__label--nariko" for="input-20"> 
      <span class="input__label-content input__label-content--nariko">Type Something</span> 
      </label> 
     </span> 


サーブレットコントローラ

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
    // TODO Auto-generated method stub 
    PrintWriter out=response.getWriter(); 
    String searchBy=request.getParameter("choice"); 

    String[] arr=new AutoCompleteDao().autoComplete(searchBy); 

request.setAttribute("arr", arr); 
    RequestDispatcher requestDispatcher=request.getRequestDispatcher("list.jsp"); 
    requestDispatcher.forward(request, response); 
} 


ダオクラスAutocompleteDao.java
パブリッククラスAutoCompleteDao =」{ プライベート静的最終的な文字列DRIVER_NAME com.mysql.jdbc.Driver " ; プライベート静的最終文字列URL = "jdbc:mysql:// localhost:3306 /"; プライベート静的最終文字列DB_NAME = "autotest";私は名前を選択すると、ここで

<%String[] str=null; 
str=(String[])request.getAttribute("arr"); 
if(str!=null){ 
//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())) 
    {%> 

     <%=str[j] %> 

<% } 
} 
str=null; 
//jQuery related end 
} 
%> 

List.jsp
結果を表示している

private static final String USER_NAME="root"; 
private static final String PASSWORD="[email protected]"; 
Connection connection; 


public String[] autoComplete(String searchBy){ 
    PreparedStatement stmt=null; 
    ResultSet resultSet=null; 

    String query=null; 
    try{ 
     //Register JDBC Driver 
     Class.forName(DRIVER_NAME).newInstance(); 
     //open a connection 
     connection=(Connection)DriverManager.getConnection(URL+DB_NAME,USER_NAME,PASSWORD); 
      switch(searchBy){ 
      case "name": 
       query= "SELECT name FROM test"; 
       break; 
      case "country": 
       query="SELECT country FROM test"; 
       break; 
      } 

     stmt=(PreparedStatement) connection.prepareStatement(query); 

    resultSet= stmt.executeQuery(); 
     List li = new ArrayList(); 




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


    } 
    catch(SQLException e){ 
     e.printStackTrace(); 
    } 
    catch(ClassNotFoundException e){ 
     e.printStackTrace(); 
    } 
    catch(InstantiationException e){ 
     e.printStackTrace(); 
    } 
    catch(IllegalAccessException e){ 
     e.printStackTrace(); 
    } 
    finally { 
     try{ 
      if(stmt!=null) 
       stmt.close(); 
      if(connection!=null) 
       connection.close(); 
     } 
     catch(SQLException e){ 
      e.printStackTrace(); 
     } 
    } 

return li.toArray(new String[li.size()]); 
} 


のWeb.xml

<servlet> 
<servlet-name>AutoCompleteServlet</servlet-name> 
    <servletclass>AutoCompleteServlet</servlet-class> 
    </servlet> 

<servlet-mapping> 
    <servlet-name>AutoCompleteServlet</servlet-name> 
    <url-pattern>/find.me</url-pattern> 
    </servlet-mapping> 


とlist.jspドロップダウンリストから入力し、自動入力には、一致が見つかったときにデータベースからの名前を表示します。しかし、国を選択したとき。 つまり、データベースからの国と名前の両方を示しています。 私は本当になぜ理解できないのですか?この時点end

$("#country").autocomplete("find.me",{extraParams: {choice: end}}); 

が空の文字列であり、それは、バックエンドに至るまで、その方法をうまくいくとしてdefaultケースを打つ:

+0

はありませんそのnot.When私は国を選択します。 @YuliiaChuhui – Arrow

答えて

0

この行だけのonload、一度だけ実行されますautoCompleteメソッドのAutocompleteDao.javaで、名前で自動完成します。

あなたはような何か行うことができる可能性があるオートコンプリート、使用しているプラ​​グインが、言っていない:私は名前を初めて選択した後

$("#country").autocomplete("find.me", { 
    extraParams: { 
    choice: function() { 
     return $("#searchby").val(); 
    } 
    } 
}); 
+0

サーあなたがドロップダウンメニューから国を選択すると、今すぐサーブレット "find.me"を2回非常に素早く呼び出すとき、最初に名前を選択すると正しい名前が自動的に表示されます。 – Arrow

+0

私はドロップダウンリストメニューからページをリフレッシュしないで次回に国を選択すると、名前と国の両方が表示されます – Arrow

+0

リバースがtrueです。初めて国を選択すると、国のみが表示されます。その後、ドロップダウンリストから名前を選択すると、今回も名前と国が表示されます – Arrow

関連する問題