22 March, 2011

Autocomplete Using jQuery

Hi All,

As we are having lot many requirments for autocomplete functionality.

Please see below lines of code for easy implementation of autocomplete using jquery.

create one web application



create java class Dummy.java.
package net.cignex.autocomplete;
import java.util.ArrayList;
import java.util.List;
import java.util.StringTokenizer;
public class Dummy {
private int totalCountries;
private String data = "Afghanistan, Albania, Algeria, Andorra, Angola, Antigua & Deps,"+
"Argentina, Armenia, Australia, Austria,Azerbaijan,Bahamas,Bahrain,Bangladesh,Barbados,"+
"Belarus,Belgium,Belize,Benin,Costa Rica,Croatia,Cuba,Cyprus,"+
"Czech Republic,Denmark,Djibouti,Dominica,Dominican Republic,East Timor,Ecuador,Egypt,El Salvador,"+
"Equatorial Guinea, Eritrea,Estonia,Korea South,Kosovo,Kuwait,Kyrgyzstan,Laos,"+
"Latvia,Lebanon,Lesotho,Liberia,Libya,Liechtenstein,Lithuania,Luxembourg,Macedonia,Madagascar,"+
"Malawi,Malaysia,Norway,Oman,Pakistan,Palau,Panama,Papua New Guinea,"+
"Paraguay,Peru,Philippines,Poland,Portugal,Qatar,Romania,Russian Federation,Rwanda,Samoa,San Marino,Sao Tome & Principe,Saudi Arabia,Senegal,"+
"Serbia,Seychelles,Sierra Leone,Singapore,Slovakia,Slovenia,Solomon Islands,Somalia,South Africa,"+
"Spain,Sri Lanka,Sudan,Suriname,Swaziland,Sweden,Switzerland,Syria,Taiwan,Tajikistan,Tanzania, "+
"Thailand,Togo,Tonga,Trinidad & Tobago,Tunisia,Turkey,Turkmenistan,Tuvalu,Uganda,Ukraine,United Arab Emirates,"+
"United Kingdom,United States";
private List countries;
public Dummy() {
countries = new ArrayList();
StringTokenizer st = new StringTokenizer(data, ",");
while(st.hasMoreTokens()) {
countries.add(st.nextToken().trim());
}
totalCountries = countries.size();
}
public List getData(String query) {
String country = null;
query = query.toLowerCase();
List matched = new ArrayList();
for(int i=0; i<TOTALCOUNTRIES; i++) {
country = countries.get(i).toLowerCase();
if(country.startsWith(query)) {
matched.add(countries.get(i));
}
}
return matched;
}
}
Create index.jsp and paste following code into it.

<html>
<head>
<LINK rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />




</head>
<body>

Country

<input type="text" id="country" name="country"/>

</body>
</html>

Next, Create getdata.jsp and copy following code into it.

<%@page import="java.util.Iterator"%>
<%@page import="java.util.List"%>
<%@page import="net.cignex.autocomplete.Dummy"%>
<% Dummy db = new DummyB(); String query = request.getParameter("q"); List countries = db.getData(query);
Iterator iterator = countries.iterator();
while(iterator.hasNext()) {
String country = (String)iterator.next();
out.println(country);
}
%>

Now deploy your web application on server and chek the functionality.

Popular Posts

Featured Post

Liferay 7.3 compatibility matrix

Compatibility Matrix Liferay's general policy is to test Liferay Portal CE against newer major releases of operating systems, open s...