SpringMVC, JQuery, JSON


http://viralpatel.net/blogs/2012/05/spring-3-mvc-autocomplete-json-tutorial.html


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;
}
}
===================================================
springMVC3-servlet.xml
===================================================
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:tx="http://www.springframework.org/schema/tx" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:jdbc="http://www.springframework.org/schema/jdbc"
xsi:schemaLocation="http://www.springframework.org/schema/beans
       http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
       http://www.springframework.org/schema/context
       http://www.springframework.org/schema/context/spring-context-3.0.xsd
       http://www.springframework.org/schema/mvc
       http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd
       http://www.springframework.org/schema/jdbc http://www.springframework.org/schema/jdbc/spring-jdbc-3.0.xsd
     http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
     http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd">
<!-- 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>

你可能感兴趣的:(springMVC)