The autocompleter instance needs to be created only once and not
during each keyup event. That's probably what is messing it up.
<script type="text/javascript">
$(document).observe('dom:loaded', function(){
Ajax.Autocompleter("auto","autocomplete","AutocompleteServlet");
});
</script>
On Mar 22, 7:51 am, tailangong <tailang...@hotmail.com> wrote:
> Well, I am doing a simple page to test ajax.autocompleter function as
> in this link
> -->http://wiki.github.com/madrobby/scriptaculous/ajax-autocompleter
>
> However, it only works in Chrome and Firefox. IE7&8 do not give
> responds no matter what I typed in the text field. (Supposedly, there
> will be a list of suggestions but it just doesn't show up in IE.)
>
> I am using scriptaculous.js v1.8.2 and prototype.js v1.6.0.3
> I'll paste my code here juz in case I miss something.
>
> My JSP page
>
> <%...@page contentType="text/html" pageEncoding="UTF-8"%>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
> "http://www.w3.org/TR/html4/loose.dtd";>
>
> <html>
> <head>
>
> <script type="text/javascript" src="Javascript/prototype.js"></
> script>
> <script type="text/javascript" src="Javascript/
> scriptaculous.js"></script>
>
> <script type="text/javascript">
>
> function trigger() {
>
> new
> Ajax.Autocompleter("auto","autocomplete","AutocompleteServlet",{
> minChars:1
>
> });
> }
> </script>
> <style>
> .autocomplete {
> position:absolute;
> width:250px;
> background-color:white;
> margin:0px;
> padding:0px;
>
> border:1px solid black;
> }
> .autocomplete ul {
> list-style-type:none;
> margin:0px;
> padding:0px;
>
> }
> .autocomplete ul li.selected { background-color: #ffb;}
> .autocomplete ul li {
> list-style-type:none;
> display:block;
> margin:0;
> padding:2px;
> height:32px;
> cursor:pointer;
>
> }
> </style>
> <meta http-equiv="Content-Type" content="text/html;
> charset=UTF-8">
> <title>Autocomplete</title>
> </head>
> <body>
> <h1>Autocomplete</h1>
>
> <form name="try" id="try" method="post">
> <input type="text" name="auto" id="auto"
> onkeyup="trigger()"/>
> <div id="autocomplete" class="autocomplete"/>
> </form>
> </body>
> </html>
>
> My AutocompleteServlet
>
> public class AutocompleteServlet extends HttpServlet {
>
> protected void processRequest(HttpServletRequest request,
> HttpServletResponse response)
> throws ServletException, IOException {
> response.setContentType("text/html;charset=UTF-8");
> PrintWriter out = response.getWriter();
> System.out.println("Ajax is here!!");
> try {
> System.out.println("Ajax is here!!");
> System.out.println(request.getParameter("auto"));
> out.println("<u1>");
> out.println("<li>Malaysia</li>");
> out.println("<li>India</li>");
> out.println("</u1>");
>
> } finally {
> out.close();
> }
> }
>
> // <editor-fold defaultstate="collapsed" desc="HttpServlet
> methods. Click on the + sign on the left to edit the code.">
> /**
> * Handles the HTTP <code>GET</code> method.
> * @param request servlet request
> * @param response servlet response
> * @throws ServletException if a servlet-specific error occurs
> * @throws IOException if an I/O error occurs
> */
> @Override
> protected void doGet(HttpServletRequest request,
> HttpServletResponse response)
> throws ServletException, IOException {
> processRequest(request, response);
> }
>
> /**
> * Handles the HTTP <code>POST</code> method.
> * @param request servlet request
> * @param response servlet response
> * @throws ServletException if a servlet-specific error occurs
> * @throws IOException if an I/O error occurs
> */
> @Override
> protected void doPost(HttpServletRequest request,
> HttpServletResponse response)
> throws ServletException, IOException {
> processRequest(request, response);
> }
>
> /**
> * Returns a short description of the servlet.
> * @return a String containing servlet description
> */
> @Override
> public String getServletInfo() {
> return "Short description";
> }// </editor-fold>
>
> }
>
> I've googled few days for this issue but to no avail. Hope you guys
> could help!
--
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
