- 浏览: 308134 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (118)
- oracle (16)
- java (13)
- jquery (16)
- hibernate (2)
- spring (14)
- struts (2)
- eclipse (1)
- birt (5)
- integrated skill (13)
- linux (9)
- css+html (5)
- redis (1)
- jqgrid (4)
- mybatis (2)
- multithreading (3)
- jvm (1)
- mvn (3)
- php (2)
- jms (2)
- photoshop (1)
- springmvc (3)
- cluster (1)
- cache (1)
- jquery-ui (2)
- 英语词根 (0)
- svn (0)
- ide (1)
- mysql (3)
- rich-text (1)
- golang (8)
- mac 10 (1)
- android (1)
- react (0)
- bootstrap (2)
- css (2)
- 1 (0)
- beego (1)
- pictures (1)
- java小生转战 (0)
- 转站通知 (0)
- 转站通知,,,啊啊啊 (1)
- threeperson (1)
- unity (1)
最新评论
-
zld406504302:
aaaddddddd
java小生转站threeperson博客 -
zld406504302:
aaaaaddd
java小生转站threeperson博客 -
zld406504302:
aaaaaaaaaaaa
java小生转站threeperson博客 -
乌发舞天:
UEditor 实例 -
van_2013:
请问这是订阅模式的配置吗?
SPRING JMS 整合ACTIVEMQ
记录一下工作中点滴,将jquery-ui autocomplete+springmvc+mybatis+oracle 实现输入提示的demo 与大家共享一下.
具备功能:
1)支持中文,英文,数字 输入提示
2)支持按中文首字母提示
js
controller
service 略
dao
sqlmapper
oracle 函数
使用方法
效果图
F_PINYIN
略有修改
具备功能:
1)支持中文,英文,数字 输入提示
2)支持按中文首字母提示
js
/** * 输入提示 * @param $searchInput 查询条件input * @param url 查询匹配内容的server url */ function onAutocomplete($searchInput , url) { $searchInput.autocomplete ({ source:function(val,parse) { //获得查询内容 var searchKeyWord = $.trim(val.term) ; if(isNull(searchKeyWord)){ return ; } //判断查询内容是否为英文 var isEn = searchKeyWord.isEn() ; $.ajax({ url:url, data:{caseName:$searchInput.val(),isEn:isEn}, dataType:'json', success:function(r){ parse(r); } }); } }); } /** * 输入提示 * 默认在name为‘searchKeyword’ input元素上添加提示功能 * @param url 查询匹配内容的server url */ function onDefaultAutocomplete(url) { var $searchInput = $("input[name='searchKeyword']") ; onAutocomplete($searchInput , url); } /* * 是否为英文 * */ String.prototype.isEn = function(){ var reg=/^[a-zA-Z]*$/gi; if(reg.test(this)) return true ; return false; };
controller
@RequestMapping("searchHelp") @ResponseBody public List<String> searchHelp(@RequestParam(value = "caseName") String caseName, @RequestParam(value = "isEn") boolean isEn) throws InterruptedException{ String userID = PsaspUtils.getLoginUser().getId(); return this.caseInfoService.getCaseNamesByUserId(caseName,userID,isEn); }
service 略
dao
public List<String> getCaseNamesByUserId(String name ,String userID,boolean isEn) { Map<String, Object> map=new HashMap<String, Object>(); map.put("userID", userID); map.put("isEn", isEn); if(StringUtils.isNotBlank(name)) { map.put("name", "%"+name+"%"); } return getSqlSession().selectList(getGlobalSqlId("getCaseNamesByUserId"),map); }
sqlmapper
<select id="getCaseNamesByUserId" parameterType="map" resultType="String"> SELECT CI.NAME FROM CASE_INFO CI RIGHT JOIN CDB_SCHEME CS ON CI.SCHEME_ID = CS.ID WHERE ( CI.USER_ID = #{userID} OR (CI.USER_ID != #{userID} AND CI.IS_SHARE = 1)) <if test="name != null"> <choose> <when test="isEn"> AND UPPER(F_PINYIN(CI.NAME)) LIKE '%'||UPPER(#{name})||'%' </when> <otherwise> AND CI.NAME like #{name} </otherwise> </choose> </if> </select>
oracle 函数
CREATE OR REPLACE FUNCTION F_PINYIN(P_NAME IN VARCHAR2) RETURN VARCHAR2 AS V_COMPARE VARCHAR2(100); V_RETURN VARCHAR2(4000); FUNCTION F_NLSSORT(P_WORD IN VARCHAR2) RETURN VARCHAR2 AS BEGIN RETURN NLSSORT(P_WORD, 'NLS_SORT=SCHINESE_PINYIN_M'); END; BEGIN FOR I IN 1..NVL(LENGTH(P_NAME), 0) LOOP V_COMPARE := F_NLSSORT(SUBSTR(P_NAME, I, 1)); IF V_COMPARE >= F_NLSSORT('吖') AND V_COMPARE <= F_NLSSORT('驁') THEN V_RETURN := V_RETURN || 'A'; ELSIF V_COMPARE >= F_NLSSORT('八') AND V_COMPARE <= F_NLSSORT('簿') THEN V_RETURN := V_RETURN || 'B'; ELSIF V_COMPARE >= F_NLSSORT('嚓') AND V_COMPARE <= F_NLSSORT('錯') THEN V_RETURN := V_RETURN || 'C'; ELSIF V_COMPARE >= F_NLSSORT('咑') AND V_COMPARE <= F_NLSSORT('鵽') THEN V_RETURN := V_RETURN || 'D'; ELSIF V_COMPARE >= F_NLSSORT('妸') AND V_COMPARE <= F_NLSSORT('樲') THEN V_RETURN := V_RETURN || 'E'; ELSIF V_COMPARE >= F_NLSSORT('发') AND V_COMPARE <= F_NLSSORT('猤') THEN V_RETURN := V_RETURN || 'F'; ELSIF V_COMPARE >= F_NLSSORT('旮') AND V_COMPARE <= F_NLSSORT('腂') THEN V_RETURN := V_RETURN || 'G'; ELSIF V_COMPARE >= F_NLSSORT('妎') AND V_COMPARE <= F_NLSSORT('夻') THEN V_RETURN := V_RETURN || 'H'; ELSIF V_COMPARE >= F_NLSSORT('丌') AND V_COMPARE <= F_NLSSORT('攈') THEN V_RETURN := V_RETURN || 'J'; ELSIF V_COMPARE >= F_NLSSORT('咔') AND V_COMPARE <= F_NLSSORT('穒') THEN V_RETURN := V_RETURN || 'K'; ELSIF V_COMPARE >= F_NLSSORT('垃') AND V_COMPARE <= F_NLSSORT('擽') THEN V_RETURN := V_RETURN || 'L'; ELSIF V_COMPARE >= F_NLSSORT('嘸') AND V_COMPARE <= F_NLSSORT('椧') THEN V_RETURN := V_RETURN || 'M'; ELSIF V_COMPARE >= F_NLSSORT('拏') AND V_COMPARE <= F_NLSSORT('瘧') THEN V_RETURN := V_RETURN || 'N'; ELSIF V_COMPARE >= F_NLSSORT('筽') AND V_COMPARE <= F_NLSSORT('漚') THEN V_RETURN := V_RETURN || 'O'; ELSIF V_COMPARE >= F_NLSSORT('妑') AND V_COMPARE <= F_NLSSORT('曝') THEN V_RETURN := V_RETURN || 'P'; ELSIF V_COMPARE >= F_NLSSORT('七') AND V_COMPARE <= F_NLSSORT('裠') THEN V_RETURN := V_RETURN || 'Q'; ELSIF V_COMPARE >= F_NLSSORT('亽') AND V_COMPARE <= F_NLSSORT('鶸') THEN V_RETURN := V_RETURN || 'R'; ELSIF V_COMPARE >= F_NLSSORT('仨') AND V_COMPARE <= F_NLSSORT('蜶') THEN V_RETURN := V_RETURN || 'S'; ELSIF V_COMPARE >= F_NLSSORT('侤') AND V_COMPARE <= F_NLSSORT('籜') THEN V_RETURN := V_RETURN || 'T'; ELSIF V_COMPARE >= F_NLSSORT('屲') AND V_COMPARE <= F_NLSSORT('鶩') THEN V_RETURN := V_RETURN || 'W'; ELSIF V_COMPARE >= F_NLSSORT('夕') AND V_COMPARE <= F_NLSSORT('鑂') THEN V_RETURN := V_RETURN || 'X'; ELSIF V_COMPARE >= F_NLSSORT('丫') AND V_COMPARE <= F_NLSSORT('韻') THEN V_RETURN := V_RETURN || 'Y'; ELSIF V_COMPARE >= F_NLSSORT('帀') AND V_COMPARE <= F_NLSSORT('咗') THEN V_RETURN := V_RETURN || 'Z'; END IF; END LOOP; IF V_RETURN is not null THEN RETURN V_RETURN; ELSE RETURN P_NAME ; END IF ; END;
使用方法
$(function(){ onDefaultAutocomplete("<c:url value='/lfc/mode/searchHelp' />"); })
效果图
F_PINYIN
引用
http://peony07.blogbus.com/logs/161366817.html
略有修改
发表评论
-
Threeperson 注册bug修复
2016-02-22 08:52 671Threeperson 注册模块,上周增加了验证码功能。最近 ... -
threeperson bootstrap 边栏
2015-12-18 17:44 583threeperson 左边栏实现左边栏参考了bootst ... -
threeperson mackdown editor
2015-12-18 17:40 777近日小生闲来 ... -
Bootstrap Markdown Editor
2015-12-16 18:03 2485今日小生闲来无事,工作不是太多,利用业余时 ... -
两款juqery autocomplete 使用总结
2013-07-06 23:50 5090近日得到一个任务:调研“输入提示”js plugin,并 ... -
jquery-autocomplete VS jquery-ui-autocomplete
2013-07-06 23:45 3729请查看http://www.threeperson.com/a ... -
gqgrid 行中动态添加链接
2012-12-20 17:13 887loadComplete:functi ... -
jqgrid
2012-11-26 22:41 692var jsonObj = parentPageParam. ... -
jqgrid 多行添加,删除
2012-10-22 16:25 4597jqgrid 多行添加,删除 遇到了一些问题: 1)用户添 ... -
jqgrid多行添加保存,jqgrid多行删除
2012-10-12 19:45 4643//保存添加行的id编号 var newrowids ... -
JQGrid 列编辑,JQGrid 添加行,JQGrid 删除行
2012-10-09 09:42 34754<script> $(documen ... -
jquery 跨域访问问题
2012-09-13 15:52 3313jquery ajax 本身是不无法进行跨域访问的,不过jq ... -
jquery 实例
2012-07-01 00:58 817闲来无事,周天在家做了个javaweb小demon , ... -
asp 嵌入html (图片轮换)
2012-06-26 15:11 2204近日朋友让我帮他改一下网站的bann ... -
jquery ajax 提交中文乱码
2012-01-06 15:19 1120昨天下午用jquery ajax 请求后台 ,发现中 ...
相关推荐
jquery-ui样式demo,非常实用,非常适合web开发
很好用的jquery-easy-ui demo
利用jQuery-UI和jsPlumb实现拖拽连接模型
jquery 弹出窗口插件,包含js中的 alert confirm open 等。
jquery-ui-1.8.21.custom 从jquery官网上下载 jquery特效demo
jquery-ui-1.8.custom.zip和大量的demo案例 大量的使用案例
jquery-ui的简单例子,下载后即可使用
包含: Jquery-ui库 (官方) Jquery的一些特效例子 (共50个)
jquery的ui组件demo和文档。jquery-ui-1.8.14.zip
最新官方jQuery UI插件 主流特效Demo,绝不含糊。 好东西不需要过多的言辞修饰,下了就知道! 所有效果说明: 基本的鼠标互动: 拖拽(drag and dropping)、排序(sorting)、选择(selecting)、缩放(resizing) 各种...
jquery-ui插件包及其demo,很好用,很美观
jquery-easy-ui 各种demo 例如tree,
有具体Demo注:jQuery-1.9.1.js下不可用,请慎重下载
jquery-ui-bootstrap jquery-ui: v.1.12.0 bootstrap: v.3.3.4 融合了bootstrap风格的jquery-ui, 对jquery-ui的js文件有微量改动,主要是针对与class的添加改动。 请到demo文件夹下预览效果。