You can view the tutorials best in Google Chrome, Mozilla Firefox, Opera, higher version of Internet Explorer

Example: Get Autocomplete Feature In Java/Jsp With jQuery API

jQuery » On Sep 9, 2012 By Sivateja

Hi friends, let us see how to get autocomplete effect in normal java/jsp applications, with the help of jQuery. I hope every body knows the importance of using autocomplete feature in java/.net or some other technologies.   Am going to use jQuery API in order to get this effect into normal jsp to make our life little easier :-) , let us start….

Required Files:

  • index.jsp
  • list.jsp
  • jquery.autocomplete.js
  • jquery-1.4.2.min.js
  • style.css

Web application Directory Structure:

te

Note:  File i used in css,images directories are just for giving little graphical touch :-) if want you can remove them.

index.jsp:

List.jsp

style.css

Output:

Explanation:

See in list.jsp line no.33 you may get one doubt, what is that ‘q‘ right ? in fact we are not sending any parameter with name ‘q’ from the input.jsp but for every keyup in the text box (in index.jsp) jquery will sends each character to the list.jsp in the form of ‘q’ and compares with the values in that list, i mean ‘q’ is the default parameter using by jQuery API.

How to send extra parameters along with that q:

$(‘#country’).autocomplete(“list.jsp”, {extraParams: {state: California }} );

This will generates the internal URL like

……./getdata.jsp?q=ourChar&state=California

 

Output Video Format:








By ( Java/J2EE Developer & Web Designer )
Founder of Java4s.com. You can contact me at sivateja [at] java4s.com


Comments

31 Responses to “Example: Get Autocomplete Feature In Java/Jsp With jQuery API”
  1. ASD says:

    Good One Java4s team.nice explanation..:)

  2. Pavan says:

    good example…sir,is their any jquery plugin for automatic session end of an user and logging out if the user is idle for some time…eg banking application…

  3. Java4s says:

    @Pavan

    Yeah we can use ‘jQuery Idle Timeout‘ concept, but i don’t encourage this way as being in session is very important for any application, if we use jQuery for sessions its little risky as jQuery depends on browsers some times.

    So always better choice is considering the underlying(in what technology we did the particular application) technology only.

  4. Ramkumar says:

    What if i want autocomplete from multiple table from a database

  5. srinivas says:

    Hai sir…………my question is…i done as same in ur page….but it’s not able to autocomplete the testbox…i created a table “countries” in database also..i added a jar file also…please suggest me to autocomplete..
    THANKS IN ADVANCE

  6. Srinu says:

    Hi, can you please explain me what is the content in jquery.autocomplete.js file and navigation from jsp page to jquery.

  7. Java4s says:

    @Srinu

    It is predefined API file, we no need to worry about that, just download and use it :-)

  8. Raaj says:

    I am using same as written here in the code , but m not getting the data..even i am printing the ‘q’ in the list.jsp ,,,,, that file also not calling even…….
    All and all in this ‘list.jsp’ is not calling ……m having that list.jsp in other location so m passing the path there,,,,,
    “jsp/masters/list.jsp” ……..please help me for this.

  9. vikram says:

    Sir thanks alot…. Fan fan fan….. :)

  10. vijay says:

    where do i get jquery.autocomplete.js and jquery-1.4.1.min.js required files

  11. ramesh golla says:

    Good Example, i got the result but when i am searching something, that is not in the list it showing many nullpointer exceptions, give solutions

  12. Praveen says:

    I followed your tutorial but the autocomplete showed “No Search Results” although i can see the results in the response sent by server in the developer tools.. What can be the issue?

    I also posted the question on stackoverflow – http://stackoverflow.com/q/16207918/1208469

  13. Afzal says:

    Thanks for this great example.. can you please help me in this case.
    In the same example i have a text box in Display.jsp and i want to send the parameter of the same text box to fetchData.java so that i can use it in sql query where condition

  14. Siva says:

    It’s ok. but How to create auto complete search for multiple tables data…

  15. alaa says:

    it good example
    but i try to with Arabic data it not work

  16. sanath says:

    this is excellent work……

  17. prasad says:

    nice example, its workingggggg.

  18. VenuGopal says:

    Hi Java4s,,,

    above example superb for single instance..and how to implements for mulltiple input instance…
    plz solution its emergency…
    thanks,

  19. kautuk says:

    thanq for the example .but as i am java learner i am not able to find Jquery so can u please send path or Jquery

    thank you once again

  20. lakshmi says:

    Hi, Thanks For This Great Example. can you please help for some issue is if i place this auto complete text box in div. results are moving along with div because that div has overflow: auto. but i don’t want that. can you please give me solution for this.

  21. Mahesh says:

    could update JSP and Webservices I am eagerly waiting for those topics
    please do it as soon as possible…

  22. Tharun says:

    thanks for the example. Its really good and understandable.

  23. naga praveen says:

    I am using same as written here in the code , but m not getting the data..I created table in database and i attach all jars but i am not getting it.pls give some suggestions
    Thanks in advance

  24. Erick Matla says:

    Excellent!!!

  25. pavithra says:

    Really good site for beginners like me…… step by step explanations…I would suggest this site for my colleagues and friends
    :-)

  26. Rajesh says:

    how to select intenseness item in auto complete items ? Can you explain briefly ?

  27. kausy says:

    Hi,
    Marvelous efforts man.Hats off.That was nice script .It has reduced my efforts.Only thing here I didn’t get is what do I need to do if I want to trigger this autocomplete function on getting 3 characters in input box.Where do I need to change in autocomplete script??It will be great if I get response .

    THanks in advance

  28. subhransu says:

    In my case. It is not working. I am using net beans.Changed the searchcontroller to controller in autocompleter.js only.

  29. Veerendranag says:

    Good Example for Begineers and Very easy to understand

Name*
Mail*
Website



By posting your answer, you agree to our comments policy.
So, What would you like to learn today?
Browse these popular technologies
Hibernate spring struts Servlets ajax Log4j jQuery Json Core Java Web Services AngularJs

Most Recent Tutorials
Hibernate Recent Posts
Spring Recent Posts
Struts Recent Posts
Recomandded Links
Current & UpComing Tutorials
Sitemap :
spring Hibernate struts Json Ajax Log4j Log4j coreJava Servlets Web Services


Upcoming
  Web Services [ SOAP ], JSP
Facebook_Java4s  Twitter_Java4s  GooglePlus_Java4s  Youtube_Java4s 
© 2010 - 2014 Java4s - Get It Yourself.
The content is copyrighted to Sivateja Kandula and may not be reproduced on other websites.