Arun Gupta, Miles to go ...

Arun Gupta is a technology enthusiast, a passionate runner, and a community guy who works for Sun Microsystems.
« JRuby on GlassFish... | Main | "Miles to go ..." 3... »

http://blogs.sun.com/arungupta/date/20080806 Wednesday August 06, 2008

TOTD #40: jQuery Autcomplete widget with MySQL, GlassFish, NetBeans

TOTD #39 explained how to create an Autocomplete widget (server-powered autocompleting of text fields, similar to Google Suggest) using Prototype/Script.aculo.us libraries with NetBeans, GlassFish and MySQL. This Tip Of The Day (TOTD) builds upon that project and shows how same functionality can be achieved using jQuery Library.

  1. Use the NetBeans project created in TOTD #39. Right-clicking on the project, select "New", "JSP...", enter the name as "index2" and click on "Finish".
  2. Download jquery JavaScript library from here (1.2.6 (minified) as of this writing) and copy into the "javascripts" folder of your NetBeans project.
  3. Copy contents from "index.jsp" into "index2.jsp".
  4. Borrowing the code from AjaxCompleter Tutorial, replace <script> tags in "index2.jsp" with the following code fragment:

            <script src="javascripts/jquery-1.2.6.min.js" type="text/javascript"></script>
            <script type="text/javascript">
                function autocomplete(autocomplete) {
                    if (autocomplete.length == 0) {
                        $('#autocomplete_choices').hide();
                    } else {
                        $.post("/Autocomplete/StatesServlet", { autocomplete_parameter: "" + autocomplete + ""},
                            function(data) {
                                if (data.length > 0) {
                                    $('#autocomplete_choices').show();
                                    $('#autocomplete_choices').html(data);
                                }
                            });
                    }
                }
            </script>

And here are couple of output screenshots:





Please leave suggestions on other TOTD (Tip Of The Day) that you'd like to see. A complete archive of all tips is available here.

Technorati: totd mysql jpa persistenceunit netbeans glassfish jquery autocomplete

Posted by Arun Gupta in web2.0  |  Comments[0]

del.icio.us | furl | simpy | slashdot | technorati | digg |
|
Comments:

Post a Comment:
  • HTML Syntax: NOT allowed
« JRuby on GlassFish... | Main | "Miles to go ..." 3... »

Valid HTML! Valid CSS!

This is a personal weblog, I do not speak for my employer.