Java Spring MVC3 Annotations, Jquery & Json : AutoComplete Example
Java Spring MVC 3 Annotations, Jquery and Json AutoComplete : -
1 Create a Dynamic Web Project in Eclipse.2 Add the below jars to library. a) spring 3.0.3 release jars b) DB related jars c) JSON lib - json-lib-2.3-jdk15.jar 3) Download jquery related js files. 4) JSP file ================================================================= JSP ================================================================= <html>
<head>
<title>jQuery Hello World Alert box</title>
<script type="text/javascript" src="jquery/jquery-1.4.4.js"></script>
<script type="text/javascript"
src="jquery/jquery-ui-1.8.6.custom.min.js"></script>
<link rel="stylesheet" type="text/css"
href="css/smoothness/jquery-ui-1.8.6.custom.css" />
</head><script>
$(function() {
function log(message) {
$("#log").append(message);
//$("__tag_12$7_").text(message).prependTo("#log");
$("#log").attr("scrollTop", 0);
} $("#trades").autocomplete(
{
source : function(request, response) {
$.ajax( {
url : "sjauto.do",
datatype : "json",
data : {
name : request.term
},
success : function(data) {
response($.map(data, function(item) {
return {
label : item,
value : item
}
}));
}
});
},
minLength : 1,
select : function(event, ui) {
log(ui.item ? "" + ui.item.label + ", "
: "Nothing selected, input was " + this.value);
},
open : function() {
$(this).removeClass("ui-corner-all").addClass(
"ui-corner-top");
},
close : function() {
$(this).removeClass("ui-corner-top").addClass(
"ui-corner-all");
}
});
});
</script><body>
<div class="demo">
<div class="ui-widget"><label for="trades">Trades: </label> <input
id="trades" /></div>
<div class="ui-widget" style="margin-top: 2em; font-family: Arial">
Result:
<div id="log" style="height: 200px; width: 300px; overflow: auto;"
class="ui-widget-content"></div>
</div>
</div>
<!-- End demo -->
</body>
</html>
<div class="demo-description">
<p>The Autocomplete widgets provides suggestions while you type into
the field. Here the suggestions are bird names, displayed when at least
two characters are entered into the field.</p>
<p>The datasource is a server-side script which returns JSON data,
specified via a simple URL for the source-option. In addition, the
minLength-option is set to 2 to avoid queries that would return too many
results and the select-event is used to display some feedback.</p>
</div>
<!-- End demo-description -->Web.xml
========================
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
id="WebApp_ID" version="2.5">
<display-name>SpringMVC3Tutorial</display-name>
<servlet>
<servlet-name>SpringMVC3</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>SpringMVC3</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
============================================================== Spring MVC 3 - Annotations Controller ============================================================= package com.tgt.rts.controller; import java.util.ArrayList;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody; import com.tgt.rts.domain.Trade;
import com.tgt.rts.service.FooService; @Controller
public class GridController { @Autowired
private FooService fooService; @RequestMapping(value = "sjauto.do", method = { RequestMethod.GET,
RequestMethod.POST })
@ResponseBody
public List<String> getAutoComplete(HttpServletRequest request,
@RequestParam String name) {
List<String> sList = new ArrayList<String>();
List<Trade> list = getTrade(name);
for (Trade trade : list) {
sList.add(trade.getSide());
}
return sList;
} private List<Trade> getTrade(String tradeId) {
try {
return this.fooService.doSomeBusinessStuff(tradeId);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
} =================================================== =================================================== <!-- import datasource and transaction manager -->
<import resource="applicationContext-infrastructure.xml" /> <context:component-scan base-package="com.tgt.rts" /> <context:annotation-config /> <mvc:annotation-driven /> <!-- enable transaction demarcation with annotations -->
<tx:annotation-driven /> <!--
define the SqlSessionFactory, notice that configLocation is not needed
when you use MapperScannerConfigurer
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource" />
</bean> --> <!-- scan for mappers and let them be autowired
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="conf.mapper" />
</bean> -->
<!-- define the MyBatis SqlSessionFactory -->
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource" />
<property name="configLocation" value="classpath:conf/mybatis-config.xml" />
</bean>
<bean id="fooService" class="com.tgt.rts.service.FooServiceDaoImpl">
<property name="tradeDao" ref="trDao" />
</bean> <bean id="trDao" class="com.tgt.rts.dao.TradeDaoImpl">
<property name="sqlSessionFactory" ref="sqlSessionFactory" />
</bean> <bean id="viewResolver"
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="viewClass"
value="org.springframework.web.servlet.view.JstlView" />
<property name="prefix" value="/WEB-INF/jsp/" />
<property name="suffix" value=".jsp" />
</bean> <mvc:view-controller path="/" view-name="index" />
</beans>
