`
sprite
  • 浏览: 63788 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

使用DWR实现搜索自动提示(一)

阅读更多
最近在公司实现了一个类似google suggest的功能,拿来和大家分享一下。主要使用javascipt + Dwr + spring +hibernate
使用Dwr当然是免不了要配置,先来看一下Dwr是如何把我们的service层(spring bean中的)方法 暴露给前端js的,它使得前端使用service就像使用javascript自定义的函数一样方便。
xml 代码
xml 代码
  1. <dwr>  
  2.     <allow>  
  3.         <!---->  
  4.         <create creator="spring" javascript="DistrictLocationService">  
  5.             <param name="beanName" value="districtLocationService" />  
  6.             <!---->  
  7.             <include method="findAllByLocationRangeFor51ditu" />  
  8.             <include method="findAllByKeywords" />  
  9.         create>  
  10. <convert converter="bean" match="com.goojia.dal.model.DistrictLocation">  
  11.             <param name="include" value="id,districtName,avgPrice,address,houseCount,lng51,lat51">param>  
  12.         convert>  
  13. allow>  
  14. dwr>  

 

java 代码
  1. service 层查找方法   
  2.   
  3.   
  4. /**  
  5.      * 根据输入的关键字查询小区信息,最大返回MAX_DISTRICT条记录  
  6.      * @param keywords  
  7.      * @return  
  8.      */  
  9.     public List<districtlocationbo></districtlocationbo> findAllByKeywords(String keywords){   
  10.  }  

 前面使用非常简单。只需要把生成的javascript导入 把componet组件放到你想放文本输入框的地方,并设置一下你想使用的样式,如果不传,将使用默认的样式  

<script type='text/javascript' src='<ww:url value="/dwr/interface/DistrictLocationService.js" includeParams="none" />'></script>
<script type='text/javascript' src='<ww:url value="/dwr/engine.js" includeParams="none" />'></script>
<script type="text/javascript" src="<ww:property value="picurl"/>js/prototype.js"></script>         
<script type="text/javascript" src="<ww:property value="picurl"/>js/autocomplete.js"></script>

html 代码
  1. <ww:component  id="district" name="districtName" template="autocomplete">  
  2.       <ww:param name="size">40ww:param>  
  3.       <ww:param name="maxlength">30ww:param>  
  4.       <ww:param name="dwrMethod">DistrictLocationService.findAllByKeywordsww:param>  
  5.       <ww:param name="hiddenId">'districtId'ww:param>  
  6.     ww:component>        

 

分享到:
评论

相关推荐

    DWR实现Google自动提示功能

    在这个实例中,“DWR实现Google自动提示功能”是利用DWR框架来构建一个类似于Google搜索框的自动提示功能,用户在输入框中输入时,后台会实时地根据输入内容提供相关的建议,无需页面刷新。 一、DWR框架详解: DWR...

    搜索自动提示列表的dwr实现实例

    3. **DWR实现搜索提示的步骤** - **创建Java后台服务**:首先,你需要在Java后端编写一个服务接口,该接口接收用户的输入并返回相关的搜索建议。这可能涉及到数据库查询或者其他数据源的操作。 - **配置DWR**:在...

    dwr实现局部刷新

    4. **AutoComplete**:DWR提供了自动完成功能,用于在客户端输入框中动态提示可能的匹配项,例如在搜索框中输入内容时显示建议列表。 5. **Echo**:DWR的Echo功能允许在后台执行长时间的任务,同时保持与客户端的...

    搜索提示框的自动显示dwr实现实例

    在这个“搜索提示框的自动显示DWR实现实例”中,我们将探讨如何利用DWR技术创建一个智能、高效的搜索输入框,当用户输入时,自动显示相关建议,提升用户体验。 首先,我们需要理解DWR的基本工作原理。DWR通过在后台...

    Ajax dwr框架实现自动补全功能

    在本文中,我们将深入探讨如何使用Ajax、Direct Web Remoting (DWR) 框架以及Hibernate ORM工具来实现一个自动补全功能。这个功能类似于百度搜索引擎中的输入提示,能够根据用户输入的字符动态地提供可能的搜索建议...

    dwr实现聊天室+级连+搜索提示

    在这个“dwr实现聊天室+级连+搜索提示”的项目中,我们将探讨以下几个关键知识点: 1. **DWR聊天室实现**: 聊天室的实现通常涉及客户端和服务器端的实时数据交换。DWR通过创建JavaScript对象(Callee)来映射...

    纯JSP+DWR实现三级联动下拉选择菜单 实现无刷新联动 DWR判断用户是否存在 ajax二级联动菜单 DWR操作数据库模拟实现Google搜索效果

    本示例主要展示了如何使用纯JSP和Direct Web Remoting (DWR)技术来构建一个功能丰富的用户界面,其中包括三级联动下拉选择菜单、无刷新联动、用户存在性判断以及模拟Google搜索效果的功能。DWR是一种JavaScript库,...

    基于JQuery和DWR的自动补全

    综上所述,结合JQuery和DWR实现的自动补全功能,不仅提升了用户输入体验,也为开发者提供了一种高效的数据交互手段。在实际开发中,可以根据项目需求灵活调整和优化,以达到最佳效果。在压缩包文件"buquan"中可能...

    DWR框架实用案例

    一旦服务器完成查询,它会将结果返回给客户端,DWR会自动将这些数据更新到页面的JavaScript变量中,从而实现在用户输入过程中动态更新下拉提示列表。 实现这个功能的具体步骤包括: 1. **配置DWR**:在Web应用中...

    DWR 含架包

    3. **AutoComplete**: DWR支持自动完成功能,常用于输入框中智能提示,如搜索建议等。 4. **CORS(Cross-Origin Resource Sharing)**: DWR支持跨域资源共享,允许来自不同源的HTTP请求访问同一资源,扩展了Web应用...

    dwr开发指南(中文)

    - **AutoComplete**:提供自动完成功能,常用于搜索框,根据用户输入的字符动态提示可能的匹配项。 - **Remote JavaScript**:允许在服务器端生成并执行JavaScript代码,进一步增强了动态性。 4. **DWR的安装与...

    Dwr+AutoComplete+pinyin4j 自动匹配(中文,拼音)

    DWR是一种JavaScript库,它允许Java代码直接在客户端(浏览器)和服务器之间进行交互,实现异步更新,类似于Ajax,但更易于使用。通过DWR,开发者可以轻松地在网页上创建动态、实时的用户界面,而无需处理复杂的HTTP...

    dwr官方资料和搜集资料大全

    Direct Web Remoting (DWR) 是一个开源Java库,它允许JavaScript在Web浏览器中与服务器端的Java对象进行交互,从而实现动态、实时的Web应用。这个“dwr官方资料和搜集资料大全”包含了丰富的资源,帮助开发者深入...

    DWR框架开发详解从入门到精通

    - **AutoComplete**:DWR提供了自动完成功能,常用于搜索框的智能提示。 在深入学习DWR的过程中,你可能还会遇到如何处理异步调用、错误处理、性能优化等方面的问题。通过阅读"DWR框架开发详解从入门到精通"这本书...

    ajax常用框架集

    - **Auto-Complete**:DWR提供了自动完成功能,常用于搜索框的实时提示。 2. **DWR的工作原理** - **Reverse Ajax**:DWR利用了HTTP长连接,使得服务器可以主动向客户端推送数据。 - **JavaScript与Java的映射**...

    快速输入地址

    在这个场景下,DWR(Direct Web Remoting)可能是被使用的工具,它是一个开源Java框架,允许JavaScript与服务器端的Java对象进行实时通信,类似于AJAX,但提供了更直接的远程方法调用。 DWR的核心概念有三部分: 1....

    几行代码的二级联动和类似goolge的输入下拉提示

    在IT行业中,二级联动是一种常见的前端交互设计,它通常出现在如选择省份后自动填充城市的下拉菜单中。这种功能能够提升用户体验,减少用户输入错误,提高数据录入的效率。而"类似Google的输入下拉提示"则是指搜索...

    像google的文本框的ajax例子

    标题 "像Google的文本框的Ajax例子" 涉及的是使用Ajax技术来实现类似Google搜索框的实时提示功能。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过...

    ajax人力资源管理系统

    首先,我们来看DWR(Direct Web Remoting),它是一个开源Java库,用于在Web应用中实现Ajax功能。DWR允许JavaScript在浏览器端与Java在服务器端进行交互,提供了一种简单的方式来调用服务器端的Java方法,并将结果...

Global site tag (gtag.js) - Google Analytics