SpringMVC, JQuery, JSON -

iloveflower

浏览: 78998 次

最近访客更多访客>>

zhaoliang0723

lyt23a

fastpace

小四他爸

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

SpringMVC, JQuery, JSON

博客分类：

Spring
jQery

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>

</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>
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 resource="applicationContext-infrastructure.xml" />
<context:component-scan base-package="com.tgt.rts" />
<context:annotation-config />
<mvc:annotation-driven />

<tx:annotation-driven />



    <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>

分享到：

jQuery UI全教程之一(dialog的使用教程) | OO Design books -good website

2012-06-07 21:33
浏览 1446
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

SpringMVC, JQuery, JSON

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

SpringMVC, JQuery, JSON

评论

发表评论

相关推荐

jQuery UI全教程之一(dialog的使用教程)

step by step guide to DWR 3.RC1 and Sprig 3.0.2 Integration

dwr step by step

DWR+SpringMVC integration

Annotation Based Spring MVC Basics

最近访客更多访客>>