- 浏览: 441660 次
- 性别:
- 来自: 成都
文章分类
最新评论
-
sunwang810812:
万分感谢中!!!!!这么多年终于看到一个可运行可解决的方案!! ...
POI 后台生成Excel,在前台显示进度 -
zzb7728317:
LZ正解
Spring Jackson AjaxFileUpload 没有执行回调函数的解决办法 -
sleeper_qp:
lz是在源码上修改的么? 源码的话你重新编译一遍了么? 可 ...
由nutch readseg -dump 中文编码乱码想到的…… -
shenjian430:
请问你改好的程序在写在哪了?
由nutch readseg -dump 中文编码乱码想到的…… -
yinxusen:
It seems to be the bug occur in ...
Mahout Local模式 执行example的注意点
因为业务需要,做一个下拉复选框,复选框里面的数据全是从数据库中取值的。从网上收了一下,没有找到比较官方的java版的下拉复选框,只搜到http://www.jb51.net/article/24012.htm里面用jQuery实现的效果,好吧,就用它吧……
为了方便使用,我把下拉复选框做成了jsp标签,具体过程如下:
1.创建Checkboxlist类继承自SimpleTagSupport,代码如下
public class Checkboxlist extends SimpleTagSupport{ private String sql; private String column; private String label; private String inputId; private String inputName; private String inputStyle; private Boolean showNull; @Override public void doTag() throws JspException, IOException { JspWriter jspWriter= getJspContext().getOut(); //利用传入的sql从数据库中取得resultSet //以下是用来组装查询的下拉复选框 jspWriter.append("<" + "script type='text/javascript'>"); jspWriter.append("$(document).ready(function() {Jselect($('#").append(inputId).append("'),{bindid:'").append(inputId).append("',hoverclass:'hover',optionsbind:function(){return ").append(inputId).append("html();}});});"); jspWriter.append("function ").append(inputId).append("html(){"); jspWriter.append("var optionshtml=\"<table style='width:100%; border: solid 1px #000;background:#fff;' cellpadding='0' cellspacing='0'>\";"); for (遍历resultSet) { String entry=resultSet每一行 if (showNull) { jspWriter.append("optionshtml=optionshtml+\"<tr><td style='width:20px'><input type='checkbox' value='"+entry+"'/></td><td>"+entry+"</td></tr>\";"); }else { if (!entry.trim().equals("")) { jspWriter.append("optionshtml=optionshtml+\"<tr><td style='width:20px'><input type='checkbox' value='"+entry+"'/></td><td>"+entry+"</td></tr>\";"); } } } jspWriter.append("optionshtml=optionshtml+\"</table>\";"); jspWriter.append("return optionshtml; }"); jspWriter.append("</script>"); jspWriter.append(label).append(":<input id='").append(inputId).append("' name='").append(inputName).append("' style='").append(inputStyle).append("' type='text' readonly='readonly'/>"); jspWriter.flush(); } public void setSql(String sql) { this.sql = sql; } public void setColumn(String column) { this.column = column; } public void setLabel(String label) { this.label = label; } public void setInputId(String inputId) { this.inputId = inputId; } public void setInputName(String inputName) { this.inputName = inputName; } public void setInputStyle(String inputStyle) { this.inputStyle = inputStyle; } public void setShowNull(Boolean showNull) { this.showNull = showNull; } public Boolean getShowNull() { return showNull; } }
2.在WEB-INF下创建customtag.tld文件:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE taglib PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN" "http://java.sun.com/dtd/web-jsptaglibrary_1_2.dtd"> <taglib> <tlib-version>1.0</tlib-version> <jsp-version>1.2</jsp-version> <short-name>cm</short-name> <tag> <name>checkboxlist</name> <tag-class>com.ed.cm.util.customtag.Checkboxlist</tag-class> <body-content>empty</body-content> <attribute> <name>sql</name> <required>true</required> <description>传入的sql语句,用于构造复选框项</description> </attribute> <attribute> <name>column</name> <required>true</required> </attribute> <attribute> <name>label</name> <required>true</required> <description>下拉复选框前的文字</description> </attribute> <attribute> <name>inputId</name> <required>true</required> <description>下拉复选框的id属性</description> </attribute> <attribute> <name>inputName</name> <required>true</required> <description>下拉复选框的name属性</description> </attribute> <attribute> <name>inputStyle</name> <required>true</required> <description>下拉复选框的style属性,主要设置width</description> </attribute> <attribute> <name>showNull</name> <required>true</required> <type>Boolean</type> <description>数据库取值为null的是否显示</description> </attribute> </tag> </taglib>
3.创建option_check.js:
(function($){ $.showselect = { init : function(o,options){ var defaults = { bindid : null, //事件绑定在bindid上 hoverclass:null, //鼠标移到选项时样式名称 optionsbind:function(){} //下拉框绑定函数 } var options = $.extend(defaults,options); if(options.optionsbind!=null){//如果绑定函数不为空 this._setbind(o,options); } if(options.bindid!=null){ this._showcontrol(o,options); } }, _showcontrol:function(o,options){//控制下拉框显示 $("#"+options.bindid).toggle(function(){ $(o).next().slideDown(); },function(){ $(o).next().slideUp(); }) }, _setbind:function(o,options){//绑定数据 var optionshtml="<div style='z-index: 999; position: absolute; height:130px; overflow:auto;'>" +options.optionsbind()+"</div>"; $(o).after(optionshtml); var offset= $(o).offset(); var w=$(o).width(); $(o).next().css({top:offset.top+$(o).height()+7,left:offset.left,width:w}); if(options.hoverclass!=null){ $(o).next().find("tr").hover(function(){$(this).addClass(options.hoverclass);}, function(){$(this).removeClass(options.hoverclass);}); } $(o).next().find("input[type=checkbox]").filter("[lang=checked]").each(function(){$(this).attr("checked","checked");}); $(o).next().find("input[type=checkbox]").click(function(){ var $ckoption=$(this).attr("checked"); if($ckoption){ $(this).attr("checked",""); }else{ $(this).attr("checked","checked"); } }); $(o).next().find("tr").click(function(){ var $ckflag=$(this).find("input[type=checkbox]"); if($ckflag.attr("checked")){ $ckflag.attr("checked",""); $ckflag.attr("lang",""); } else{ $ckflag.attr("checked","checked"); $ckflag.attr("lang","checked"); } var selarray=new Array(); $(o).next().find("input[type=checkbox]").each(function(){ if($(this).attr("checked")) selarray.push($(this).parent().next().text()); }); $(o).val(selarray.join(',')); }); $(o).next().hide(); } } Jselect = function(o,json){ $.showselect.init(o,json); }; })(jQuery);
4.在jsp中使用,加入一行
<%@ taglib uri="/WEB-INF/customtag.tld" prefix="cm"%>添加css样式
<style type="text/css"> .hover { background-color: #c0c0c0; color: #fff; } </style>
引入jquery.js和option_check.js
使用时:
<cm:checkboxlist sql="SELECT XXX FROM XXX where XXX" column="XXX" label="XXX" inputId="XXX" inputName="XXX" inputStyle="width: 200px;" showNull="false"></cm:checkboxlist>5.ok,下拉复选框的样式确实有点丑,有兴趣的朋友可以修改一下,改的好看可以给我一份哈,我实在没有美工的天分╮(╯▽╰)╭
评论
1 楼
jayghost
2011-09-03
我可以很负责任的告诉大家,我已经把这个标签的前台换成了http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/的样子,方法类似,如果需要显示成中文,加上
$(".multiselect").multiselect({ checkAllText: "全选", uncheckAllText: "不全选", noneSelectedText: "请选择", selectedText: "选中#/#", minWidth: 150 });
发表评论
-
hibernate的Criteria Query(转)
2014-06-29 21:22 717当查询数据时,人们往往需要设置查询条件。在SQL或HQL语句 ... -
【转】hibernate 中 Criteria 的使用介绍
2014-06-29 21:21 970转自:http://www.blogjava.net/jjs ... -
【转】Hibernate中Criteria的完整用法
2014-06-29 21:20 722转自:http://www.cnblogs.com/maba ... -
Java读写Oracle中的BLOB和CLOB
2013-10-16 18:00 2012转:http://www.iteye.com/topic/6 ... -
Spring的事务管理入门:编程式事务管理(TransactionTemplate)
2013-10-15 16:20 1030可有效应用于Oracle 临时表的insert和select ... -
jdbcTemplate 调用存储过程和回到函数
2013-10-15 09:09 3777转:http://blog.csdn.net/dancelo ... -
Spring3核心技术之JdbcTemplate
2013-10-15 09:03 1330转:http://zhou137520.iteye.com/ ... -
验证码在WebLogic下报错java.io.IOException: response already committed
2013-05-06 14:16 2608我的登录验证码代码,一个jsp,在Tomcat下没有问题,但 ... -
Struts2在eclipse的console中总是出现WARN OgnlValueStack:45 - Could not find property
2013-04-17 18:00 1728struts2 在发开时,控制台如输出大量警告信息,太烦人 ... -
【转】Eclipse自动关闭解决方法及eclipse.ini设置
2013-03-29 15:21 3810转自:http://liujun5563.blog.163. ... -
[转]批量将Java源代码文件的编码从GBK转为UTF-8
2012-11-12 13:43 1509转自:http://my.oschina.net/binny/ ... -
对代理模式与Java动态代理类的理解
2012-09-25 01:51 01. 代理模式 代理模式的作用是:为其他对象提供一种 ... -
【转】 java中yield(),sleep()以及wait()的区别
2012-09-13 22:49 863从操作系统的角度讲,os会维护一个ready queue(就绪 ... -
java 继承类 变量、静态变量、构造函数执行顺序
2012-09-10 16:07 1052包含普通变量、静态变量、构造函数、继承类的执行顺序为: 1、父 ... -
京东2012春笔试编程题
2012-09-10 12:58 01、求给定数组中最大的K个数function array[] ... -
Java实现Stack、Queue、BinaryTree
2012-09-11 10:28 14931、用数组实现Stack: public class MySt ... -
Java中a++和++a的分析
2012-09-18 08:34 2868本人从编译后的代码来看a++和++a的区别: 先看代码1: ... -
华为2012校园上机编程题
2012-09-09 16:04 0/** * 1. 手机号码合法 ... -
2011年9月7日,华为上机题Java实现
2012-09-08 15:58 0第二题: /** * 输入字符串长度len,字符串str, ... -
Java对于Cookie的操作详解
2012-09-18 08:34 8211.设置Cookie Cookie cookie = n ...
相关推荐
在网页开发中,"jsp/html 实现下拉复选框" 是一个常见的需求,它能够为用户提供更加便捷的多选项选择方式。下拉复选框通常由HTML的`<select>`元素与`<option>`子元素配合使用,而为了实现更丰富的交互效果,我们可能...
QTreeView Checkboxes 需要实现一个功能:在QT的TreeView中,能够使用复选框,并且选中父节点的复选框可以全选或取消子节点的复选框。 参考链接: http://blog.csdn.net/ajaxhe/article/details/7518285
总结,"非常简单的下拉复选框"JavaScript插件是实现高效、美观的多选项选择的理想工具。其简洁的设计、良好的兼容性和丰富的自定义选项,使得它成为前端开发者在构建网页表单时的一个优秀选择。通过理解和掌握这款...
在IT领域,特别是前端开发中,复选框树(Checkbox Treeview)是一种常见的用户界面元素,它结合了树形结构和复选框的功能,让用户能够方便地选择或取消选择树形结构中的节点。这个特定的资源,"js+xml实现的复选框树...
本示例中,我们关注的是如何使用jQuery来实现复选框(checkbox)的全选和反选功能,这对于构建具有交互性的表单或者需要用户进行多选操作的界面是非常实用的。 在HTML中,复选框通常由`<input>`标签定义,类型为...
**jQuery无限极复选框下拉树**是一种交互式的用户界面元素,常用于在Web应用中展示层次结构的数据,如组织结构、目录树或者复杂的分类系统。这种组件允许用户通过展开和折叠节点来查看和选择多级选项。下面将详细...
**jQuery高性能带复选框的树形结构插件——highchecktree** 在Web开发中,树形结构常常用于展示层级关系的数据,例如组织结构、文件系统等。`highchecktree`是一个专门针对这种情况设计的jQuery插件,它能高效地...
总的来说,"jQuery点击弹出下拉复选框代码.zip"提供的示例代码涉及了前端开发的多个关键领域,包括DOM操作、事件处理、CSS样式设计以及用户体验优化。通过学习和理解这段代码,开发者可以提升自己的前端技能,更好地...
【jsp+js带单选复选框的动态树】是一个基于Java Server Pages(JSP)和JavaScript技术实现的交互式树形结构,通常用于展示层级关系的数据,如组织架构、文件目录等。在这个应用场景中,用户可以进行选择操作,通过...
在IT领域,尤其是在前端开发中,"SelectBox下拉复选框多选插件"是一种常用的用户界面元素,用于提供用户友好的多选项选择功能。它结合了传统的下拉列表和复选框的特性,使得在有限的空间内,用户能够方便地筛选和...
在Windows Forms(WinForm)开发中,我们经常需要在用户界面中实现更加复杂的功能,比如一个下拉列表,其中每个选项都有对应的复选框。这样的控件可以为用户提供更多的选择和交互方式,使得应用程序更加直观易用。...
本教程主要探讨的是如何使用jQuery实现多级复选框(checkbox)的功能,包括水平横向、垂直纵向两种排列方式,并且提供了三种不同的样式供选择。通过这个项目,我们可以学习到如何用jQuery控制复选框的状态,以及如何...
本项目专注于使用jQuery来美化复选框(checkbox)的样式,为用户提供更加美观和定制化的界面体验。 首先,复选框是HTML中一种基本的表单元素,通常用于让用户在多个选项中进行多选。然而,浏览器默认的复选框样式...
它提供了多种视图模式,包括报告视图,其中可以包含复选框(Checkbox)来实现用户交互。本示例着重讲解如何在ListView中实现复选框的单选功能。 在Delphi中,ListView的复选框功能可以通过设置`ListView.Style`属性...
jQuery作为一个强大的JavaScript库,提供了解决这一问题的方法,可以通过自定义CSS和事件处理来实现复选框的美化和交互功能。本文将详细介绍如何使用jQuery实现复选框的选中与不选中效果的美化。 首先,我们需要...
**jQuery 复选框组件详解** 在Web开发中,复选框(Checkbox)是一种常见的用户交互元素,用于让用户从多个选项中选择一个或多个。jQuery,作为一款强大的JavaScript库,提供了丰富的插件和方法来增强复选框的功能和...
在JavaServer Pages (JSP) 开发中,常常需要实现用户界面中的批量选择功能,比如在列表中通过复选框来选中多个项目。本文将详细介绍如何在JSP中实现这样的功能,主要涉及HTML、JavaScript 和后端Java的交互。 首先...
对于jQuery自定义复选框checkbox和单选框Radiobox,我们已经有介绍过不少了,比如9款迷人样式的CSS3自定义Checkbox复选框和HTML5/CSS3开关按钮 立体3D按钮。今天要介绍的是一款基于jQuery的美化版复选框,它的特点是...
本教程将深入探讨如何在QTableView中添加复选框,特别是在表头和第一列中实现这一功能,以增强用户界面的交互性。 首先,我们要明白QTableView的工作原理。它是基于QAbstractItemView类的,通过QStandardItemModel...
在探讨如何使用jQuery判断复选框(checkbox)是否被选中的过程中,我们首先需要理解复选框的基本属性以及jQuery操作DOM元素的方式。复选框在HTML中被定义为`<input type="checkbox">`,当它被选中时,其`checked`属性...