checkbox复选框动态加载数据库数据

一、本文目的简介:

  1.  使用从数据库查询出来的数据,后台映射为对象集合,JSP页面加载显示复选框;
  2.  设置集合对象"是否选中"属性,实现checkbox动态选中

二、

  1. 实体对象,部分代码片段如下
public class CustomerLevel {

	/** 等级编号**/
	private String levelCode;
	/** 等级名称**/
	private String levelName;
	/**是否选中*/
	private boolean checked;
	public String getLevelCode() {
		return levelCode;
	}
	public void setLevelCode(String levelCode) {
		this.levelCode = levelCode;
	}
	public String getLevelName() {
		return levelName;
	}
	public void setLevelName(String levelName) {
		this.levelName = levelName;
	}
	public boolean isChecked() {
		return checked;
	}
	public void setChecked(boolean checked) {
		this.checked = checked;
	}
	
}

2.action层定义List,用以接收从数据库查询出来的集合对象,生成setter方法

private List<CustomerLevel> customerLevels;

public List<CustomerLevel> getCustomerLevels() {
		return customerLevels;
}
public void setCustomerLevels(List<CustomerLevel> customerLevels) {
		this.customerLevels = customerLevels;
}

public String queryCustLeves(){
		customerLevels = customerLevelService.queryCustomerLevel(customerLevel);
		return SUCCESS;
}

3.JSP加载LIST 

<tr height="35px">
	<td class="tdClass" align="left">
			客户等级:
	</td>
 <s:iterator value="customerLevels" status="cust"> 
	<td>

        <!-- 根据状态判断是否已选中 -->
		<input type="checkbox" id="custLeveL" value="<s:property value='customerLevels[#cust.index].levelCode'/>" 
			<s:if test='customerLevels[#cust.index].checked==true'>checked="checked"</s:if>  onclick="getCheckEvent(this);"/>
			<label>
                    <!--checkbox标签名称(对象属性) -->
				<s:property  value="customerLevels[#cust.index].levelName"/>
			</label>
	</td>
   <!-- 每3个checkbox一行 -->
	<s:if test="(#cust.index+1) % 3 == 0">
		</tr>
			<tr height="35px">
				<td class="tdClass" align="left">
						&nbsp;&nbsp;&nbsp;&nbsp;
			</td>
	</s:if>
	<s:if test="#cust.last">
			 </tr>
	</s:if>
</s:iterator>

4、JS控制复选框是否选中,复选框点击前如果默认选中,再次点击则不选中,反之,则选中。

<script type="text/javascript">
    function getCheckEvent(obj){
			if($(obj).is(':checked')){
				 $(obj).prop('checked', false);
			}else{
				$(obj).prop('checked', true);
			}
		}
</script>

5、效果展示

 

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,在JSP页面中,你需要使用HTML表单来包含框。可以使用类似下面的代码: ``` <form action="insert.jsp" method="post"> <input type="checkbox" name="fruit" value="apple"> Apple <br> <input type="checkbox" name="fruit" value="banana"> Banana <br> <input type="checkbox" name="fruit" value="orange"> Orange <br> <input type="submit" value="Submit"> </form> ``` 注意,所有的框都有相同的名称 `fruit`,但是不同的值。 接下来,在insert.jsp页面中,你可以使用JDBC连接到数据库,并将中的框值插入到数据库中。可以使用类似下面的代码: ``` <%@ page import="java.sql.*" %> <% String[] fruits = request.getParameterValues("fruit"); // 获取中的框值 if (fruits != null && fruits.length > 0) { Connection conn = null; PreparedStatement stmt = null; try { Class.forName("com.mysql.jdbc.Driver"); // MySQL驱动 String url = "jdbc:mysql://localhost:3306/mydatabase"; // 数据库连接URL String username = "root"; // 数据库用户名 String password = "123456"; // 数据库密码 conn = DriverManager.getConnection(url, username, password); // 创建数据库连接 String sql = "INSERT INTO fruits (name) VALUES (?)"; // 插入数据的SQL语句 stmt = conn.prepareStatement(sql); // 创建PreparedStatement对象 for (int i = 0; i < fruits.length; i++) { stmt.setString(1, fruits[i]); // 设置参数 stmt.executeUpdate(); // 执行SQL语句 } } catch (ClassNotFoundException e) { e.printStackTrace(); } catch (SQLException e) { e.printStackTrace(); } finally { try { if (stmt != null) stmt.close(); // 关闭Statement对象 if (conn != null) conn.close(); // 关闭Connection对象 } catch (SQLException e) { e.printStackTrace(); } } } %> ``` 这个JSP页面首先获取中的框值,然后使用JDBC连接到数据库,并将中的框值插入到名为 `fruits` 的数据库表中。在这个例子中,使用了MySQL数据库,表中只有一个 `name` 字段。你需要根据自己的实际情况来修改代码。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值