Автозаполнение поиска - PullRequest
       2

Автозаполнение поиска

0 голосов
/ 12 апреля 2011

Привет всем, мне нужен простой код автоматического предложения, который я пробовал с jquery.autocomplete.js не получает то, что мне нужно, чтобы сделать код: - index.jsp

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">  

 <html>  

 <head>  

     <link rel="stylesheet" type="text/css" href="style.css" />  

     <script type="text/javascript" src="jquery-1.3.2.min.js"></script>  

     <script type="text/javascript" src="jquery.autocomplete.js"></script>  

 </head>  

 <body>  

     <div style="width: 300px; margin: 50px auto;">  

         <b>Country</b>   : <input type="text" id="country" name="country" class="input_text"/>  

     </div>  



 </body>  

 <script>  

     jQuery(function(){  

         $("#country").autocomplete("list.jsp");  

     });  

 </script>  


 </html> 


and list.jsp
<%@page import="java.util.Iterator"%>  

 <%@page import="java.util.List"%>  

 <%@page import="java.util.ArrayList"%>  

 <%  

    String countries[] = {  

                             "Afghanistan",  

                            "Albania",  

                             "Algeria",  

                            "Andorra",  

                             "Angola",  

                             "Antigua and Barbuda",  

                             "Argentina",  

                             "Armenia",  

                             "Yemen",  

                             "Zambia",  

                             "Zimbabwe" 

                             };  



     String query = (String)request.getParameter("q");  

     System.out.println("1"+request.getParameterNames().nextElement());  

     response.setHeader("Content-Type", "text/html");  

     int cnt=1;  

     for(int i=0;i<countries.length;i++)  

     {  

         if(countries[i].toUpperCase().startsWith(query.toUpperCase()))  

        {  

            out.print(countries[i]+"\n");  

             if(cnt>=10)  
                break;  

             cnt++;  

         }  

     }  

 %> 

есть еще один стиль.css есть, но он ничего не показывает во время выполнения, все исходные файлы находятся в той же папке, скажите, пожалуйста, где мне не хватает

Ответы [ 2 ]

1 голос
/ 12 апреля 2011

Согласно документации автозаполнения, вам необходим javascript-объект json. Это контейнер для всех ваших данных. Я скучаю по этому контейнеру в вашем исходном коде, который вы опубликовали.

Если вы нажмете на Демонстрации полного завершения , прокрутите страницу до конца. Я думаю, что последняя демонстрация представляет то, что вы ищете.

0 голосов
/ 12 апреля 2011
<% 
 String countries[] = {"Afghanistan","Albania","Algeria","Andorra","Angola","Antigua and Barbuda","Argentina","Armenia","Yemen","Zambia","Zimbabwe"};
 String query = (String)request.getParameter("q");
 response.setHeader("Content-Type","text/html"); 
 String javascriptContent = new String ("");
 int cnt = countries.length;
 if(cnt > 10)
 {
  cnt = 10;
 }
 for(int i=0;i<cnt;i++)
 { 
    if(countries[i].toUpperCase().startsWith(query.toUpperCase()))
    {
        javascriptContent.concat(countries.get(i));
        if (i < (cnt -1))
        {
            javascriptContent.concat(",");
        } 
    }
} 
%>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/demo/main.css" type="text/css" />
    <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.css" type="text/css" />
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js"></script>
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js"></script>
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            var data = "<%=  javascriptContent %>".split(",");
            $("#country").autocomplete(data);
        });
    </script>
</head>
<body>
    <b>Country</b>   : <input type="text" id="country" name="country" class="input_text"/></div>
</body>
</html>  

Вот они и веселятся.Я скопировал html исходный код с главной страницы автозаполнения.Пожалуйста, сначала проверьте синтаксис Java.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...