jQuery+SpringMVC中的复选框选择与传值

最新推荐文章于 2022-11-14 00:15:30 发布
最新推荐文章于 2022-11-14 00:15:30 发布
阅读量1.2k 收藏 2
点赞数 1

一、checkbox选择

在jQuery中，选中checkbox通用的两种方式：

$("#cb1").attr("checked","checked");
$("#cb1").attr("checked",true);

对应的jQuery函数，主要完成三个功能：

1、第一个复选框选中或取消选中，则下面的复选框为全选或取消全选；

2、当下面的复选框全部选中时，则将第一个复选框设置为选中，当下面的复选框中有一个没有被选中时，则第一个复选框取消选中；

3、将下面的复选框的id值传递给Controller层，组成id数组，然后调用相应的方法（一般都是删除）。

复制代码 
<script type="text/javascript">    function chgAll(t){//第一个复选框选中或取消选中，则下面的复选框为全选或取消全选；
        $("input[name='id']").attr('checked',t.checked);//改变name名为id的input标签内的复选框的checked属性
    }
    function chg(){//当下面的复选框全部选中时，则将第一个复选框设置为选中，当下面的复选框中有一个没有被选中时，则第一个复选框取消选中；
        var ids = $.makeArray($("input[name='id']"));
        for(var i in ids){
            if(ids[i].checked==false){//如果所有的复选框只要有一个未选中，则第一个复选框不会选中
                $("input[name='ids']").attr('checked', false); return; } } $("input[name='ids']").attr('checked', true);//全部选中的情况下，则第一个复选框选中 } function deleteBatch(){//将下面的复选框的id值传递给Controller层，组成id数组，拼接url到controller层，调用批量删除方法（deleteBatch())方法 var ids = $.makeArray($("input[name='id']:checked"));//通过$.makeArray将id放在数组中 var url = '<%basePath%>/web/goodsList/deleteBatch';//此url指向controller层的deleteBatch方法，需要id属性 var flag = true; for(var i in ids){//遍历数组 if(i == 0){ url += "?id=" + ids[i].value;//第一个id属性前加？拼接 flag = false;  } else { url += "&id=" + ids[i].value;//后面的id属性前加&拼接 flag = false;  } } if(flag){//如果没有选中商品 alert("请选中商品！"); return; } if(confirm("确定删除记录吗？")){ window.location.href = url;//把拼接好的id数组传给页面 } } </script>
复制代码

二、在jsp页面中对应的列表：

1、列表中要给表头中的复选框（第一个复选框）设置name名，并调用chgAll(this)方法来实现全选或全不选；

2、table中的复选框设置name名，并调用chg()方法来实现上面的第二个功能；

3、form表单提交时调用deleteBatch()方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<body>
     <form:form id= "uuForm" modelAttribute= "goods"    action= "<%basePath%>/web/goodsList/" method= "post" > //form表单提交时调用deleteBatch()方法
         <div> <input  type= "button"    onclick= "deleteBatch()" value= "批量删除" />  </div>
     </form:form>
     <sys:message content= "${message}" />
     <table id= "cTable" >
         <thead>
             <tr>
             <th><input type= "checkbox" name= "ids"  onchange= "chgAll(this)" /></th> //调用chgAll(this)方法来实现全选或全不选,此处的this指所有复选框对象
                 <th>商品编号</th>
                 <th>商品标题</th>
             </tr>
         </thead>
         <tbody>
             <c:forEach items= "${goods}" var = "goods" varStatus= "status" >
                 <tr>
                 <td><input type= "checkbox"  name= "id" value= "${goods.goodsId }" onchange= "chg()" /></td> //调用chg()方法
                     <td>${webGoodsInfo.goodsNo}</td>
                     <td>${webGoodsInfo.goodsTitle}</td>
                 </tr>
             </c:forEach>
         </tbody>
     </table>
     
</body>

三、看下spring MCV中的controller代码

1
2
3
4
5
6
7
8
@RequestMapping( "deleteBatch" ) //对应jsp页面中的deleteBatch()请求
     public String deleteBatch(Long[] id, RedirectAttributes redirectAttributes){ //此处的id为页面中的id值，必须保持一直！！！！
         if (id != null &&id.length!=0){
             goodsService.deleteBatch(id);
         }
         return "redirect:" +Global.getAdminPath()+ "/web/webGoodsInfo/?repage" ; //重定向到列表页面
     }
}

看下效果：

　

（代码部分我省略了不少，但是今天讲的复选框多选与传值的部分全部无损呈现！）

小边的博客
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
checkbox复选框传值
12-03
复选框里的值通过表单post方法传入数据库
jQuery+SpringMVC中的复选框选择与传值实例
10-18
下面小编就为大家分享一篇jQuery+SpringMVC中的复选框选择与传值实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Springmvc处理复选框数据
YcUrial的博客
12-09 8554
springmvc处理复选框的value数据时，只要把复选框放在form表单中直接提交，在Controller中用对应类型的数组接受即可，无需其他乱七八糟的拼接字符串，再传值什么的 jsp表单:<form action="<%=basePath%>student/selectCourse.do" id="grid" name="grid" ><table cellspacing="0" borde
spring mvc：复选框（多选）
weixin_33910434的博客
04-20 821
以user为例，user下有 username用户，password密码, address地址, receivePaper是否订阅, favotireFramework兴趣爱好, user.java public class User { private String username; private String password; private String addr...
SpringMVC如何获取复选框中的值呢？
qq_25073223的博客
11-14 593
SpringMVC获取复选框中的值的方法分享，如下所示
Spring4+SpringMVC+MyBatis完整框架网上商城
05-28
SpringMVC MyBatis 模板引擎beetl 前端bootstrap 数据源druid 缓存ehcache MyBatis分页插件PageHelper MyBatis通用Mapper 源码完整+带sql脚本+亲测可以用，而且功能很强大，是一个完善的框架实例。
Spring+SpringMVC+Mybatis框架整合例子(SSM) 下载
07-21
Spring、SpringMVC和Mybatis是Java开发中最常用的三大开源框架，它们的整合使用，通常被称为SSM框架。这个框架组合提供了完整的后端服务解决方案，包括依赖注入（DI）、面向切面编程（AOP）、模型-视图-控制器（MVC...
Spring+SpringMVC+Hibernate框架集成详解
04-12
Spring+SpringMVC+Hibernate 框架集成详解 本文档旨在详细介绍 Spring、SpringMVC 和 Hibernate 框架的集成，旨在帮助开发人员快速了解这三个框架的集成过程。 Spring 框架 Spring 框架是一个 Java 语言的开源...
springmvc前台向后台传值几种方式从简单到复杂
revent的专栏
03-20 1万+
1. 基本数据类型(以int为例，其他类似)： Controller代码： @RequestMapping("saysth.do") public void test(int count) { } 表单代码： &lt;form action="saysth.do" method="post"&gt; &lt;input name="count" value="10" type=&quo
checkbox选中 全选 传值
03-15
NULL 博文链接：https://pireswang.iteye.com/blog/325577
Spring MVC遭遇checkbox的问题解决方案
weixin_34117211的博客
05-06 357
Spring MVC遭遇checkbox的问题是：当checkbox全不选时候，则该checkbox域的变量为null，不能动态绑定到spring的controller方法的入参上，并抛出异常。解决方案：1、javascript方式提交，提交前拼提交参数串，拼完后通过ajax方式提交。可以使用controller请求参数绑定。    缺点：逐个提取表单参数，并对checkbox选项参数进行判断拼装...
php复选框如何传递选中,php复选框checkbox参数传递问题的解决方法
weixin_33563728的博客
03-11 410
在网页中，使用多选框可以一次性选择多个属性值，进行批量操作。网页中checkbox的用法一般为：在asp中，可以直接使用 request.form("code1") 获取参数值，request.form("code1")的值是以逗号 “, ”分割，比如上面如果全部勾选，那么获得的值为：1, 2, 3。可以使用split函数进行切割，从而对每个参数进行合适的处理。在php编程中，是无法直接通过$_P...
PHP（2）复选框表单传值
shi_zi_183的博客
11-15 1883
PHP（2）复选框表单传值 复选框：通常是将一类内容以同样（同名）的形式传递给后台，数据库储存通常是一个字符储存。选中才会提交，不选不会提交。 <!DOCTYPE html> <html> <head> <title>"测试"</title> <meta charset="utf-8"> </head> <body> <form method="post" action=
input type="checkbox" 选中传值，不选中传值
热门推荐
赵乘风_i
01-07 2万+
最近在使用form表单时，出现了一个问题，checkbox如果选中会传true，没选中就什么都不传，但是这不是想要的效果呀，希望做到选中时传true，不选中时传false。 那么就有以下两种方法 1. <input name="public" type="checkbox" onclick="javascript:document.getElementById('public'...
jquery设置checked及复选框 多个提交
zhang1088632743的博客
09-22 1508
今天碰到的一些小问题  结合百度来给博客写点 $('#sz').attr('checked','true');或者$("sz").attr("checked",true) 或者 $("sz").attr("checked","checked") 发现 attr  成功了 ，但我清除选中状态的时候就再选中不了  后面发现用prop可以 attributes和properties之间的
checkbox单击事件,默认勾选
程序员思维的博客
08-17 3861
<label><input id="IsProp" type="checkbox">需要试用</label> <script> $(function(){ //设置默认勾选 $("#IsProp").attr("checked", "checked"); //绑定单击事件 $("#IsProp").on("click", function () { if ($(this).prop("checked")) {
JQuery实现复选框CheckBox的全选、反选、提交操作
pan_junbiao的博客
07-29 2380
对复选框最基本的应用，就是对复选框进行全选、反选和提交等操作。复杂的操作需要与选项挂钩，来达到各种级联反应效果。 【示例】使用Jquery实现复选框CheckBox的全选、反选、提交操作。 （1）创建页面，创建一个表格在表格的第一列中放入一组复选框，并实现复选框的全选、反选、提交操作。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>
Spring+SpringMVC+MyBatis框架技术精讲与整合案例
最新发布
05-21
Spring+SpringMVC+MyBatis框架技术整合是目前Java企业级应用开发中最为流行的技术组合之一。在这个技术组合中，Spring负责IoC和AOP，SpringMVC则是MVC框架，而MyBatis则是ORM框架。 下面是一个简单的整合案例： 1. 首先，我们需要创建一个Maven项目，并添加Spring、SpringMVC和MyBatis的依赖： ```xml <!-- Spring --> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-context</artifactId> <version>4.3.3.RELEASE</version> </dependency> <!-- Spring MVC --> <dependency> <groupId>org.springframework</groupId> <artifactId>spring-webmvc</artifactId> <version>4.3.3.RELEASE</version> </dependency> <!-- MyBatis --> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis</artifactId> <version>3.5.5</version> </dependency> ``` 2. 接着，我们需要配置Spring、SpringMVC和MyBatis的配置文件。在这里，我们使用注解方式配置Spring和SpringMVC，而使用XML方式配置MyBatis。 Spring配置文件： ```java @Configuration @ComponentScan(basePackages = "com.example") @EnableWebMvc public class AppConfig { // ... 配置其他Bean @Bean public DataSource dataSource() { // 配置数据源 return new DriverManagerDataSource(); } @Bean public SqlSessionFactory sqlSessionFactory() throws Exception { SqlSessionFactoryBean sessionFactory = new SqlSessionFactoryBean(); sessionFactory.setDataSource(dataSource()); // 配置MyBatis插件 Interceptor[] plugins = {pageHelper()}; sessionFactory.setPlugins(plugins); // 配置MyBatis映射文件 sessionFactory.setMapperLocations(new PathMatchingResourcePatternResolver() .getResources("classpath*:mapper/*.xml")); return sessionFactory.getObject(); } @Bean public MapperScannerConfigurer mapperScannerConfigurer() { MapperScannerConfigurer scannerConfigurer = new MapperScannerConfigurer(); scannerConfigurer.setBasePackage("com.example.mapper"); scannerConfigurer.setSqlSessionFactoryBeanName("sqlSessionFactory"); return scannerConfigurer; } @Bean public PageInterceptor pageHelper() { PageInterceptor pageInterceptor = new PageInterceptor(); Properties properties = new Properties(); properties.setProperty("helperDialect", "mysql"); pageInterceptor.setProperties(properties); return pageInterceptor; } } ``` SpringMVC配置文件： ```java @Configuration public class WebConfig implements WebMvcConfigurer { // ... 配置其他内容 @Bean public ViewResolver viewResolver() { // 配置视图解析器 InternalResourceViewResolver viewResolver = new InternalResourceViewResolver(); viewResolver.setPrefix("/WEB-INF/views/"); viewResolver.setSuffix(".jsp"); return viewResolver; } @Override public void addResourceHandlers(ResourceHandlerRegistry registry) { // 配置静态资源 registry.addResourceHandler("/static/**") .addResourceLocations("/static/"); } @Override public void configureDefaultServletHandling(DefaultServletHandlerConfigurer configurer) { configurer.enable(); } } ``` MyBatis配置文件： ```xml <configuration> <typeAliases> <!-- 配置别名 --> <package name="com.example.model"/> </typeAliases> <mappers> <!-- 配置映射文件 --> <mapper resource="mapper/userMapper.xml"/> </mappers> <!-- 配置分页插件 --> <plugins> <plugin interceptor="com.github.pagehelper.PageInterceptor"> <property name="helperDialect" value="mysql"/> </plugin> </plugins> </configuration> ``` 3. 接着，我们需要创建Controller和Mapper接口以及对应的视图和映射文件。这里我们以用户管理为例： UserController.java： ```java @Controller @RequestMapping("/user") public class UserController { @Autowired private UserService userService; @RequestMapping(value = "/list", method = RequestMethod.GET) public String list(Model model) { List<User> users = userService.getAllUsers(); model.addAttribute("users", users); return "user/list"; } @RequestMapping(value = "/add", method = RequestMethod.GET) public String addForm() { return "user/add"; } @RequestMapping(value = "/add", method = RequestMethod.POST) public String add(User user) { userService.addUser(user); return "redirect:/user/list"; } @RequestMapping(value = "/edit/{id}", method = RequestMethod.GET) public String editForm(@PathVariable("id") Long id, Model model) { User user = userService.getUserById(id); model.addAttribute("user", user); return "user/edit"; } @RequestMapping(value = "/edit", method = RequestMethod.POST) public String edit(User user) { userService.updateUser(user); return "redirect:/user/list"; } @RequestMapping(value = "/delete/{id}", method = RequestMethod.GET) public String delete(@PathVariable("id") Long id) { userService.deleteUser(id); return "redirect:/user/list"; } } ``` UserMapper.java： ```java public interface UserMapper { List<User> getAllUsers(); User getUserById(Long id); void addUser(User user); void updateUser(User user); void deleteUser(Long id); } ``` userMapper.xml： ```xml <mapper namespace="com.example.mapper.UserMapper"> <resultMap id="userMap" type="com.example.model.User"> <id property="id" column="id" /> <result property="name" column="name" /> <result property="age" column="age" /> </resultMap> <select id="getAllUsers" resultMap="userMap"> SELECT * FROM user </select> <select id="getUserById" resultMap="userMap"> SELECT * FROM user WHERE id = #{id} </select> <insert id="addUser" useGeneratedKeys="true" keyProperty="id"> INSERT INTO user(name, age) VALUES(#{name}, #{age}) </insert> <update id="updateUser"> UPDATE user SET name = #{name}, age = #{age} WHERE id = #{id} </update> <delete id="deleteUser"> DELETE FROM user WHERE id = #{id} </delete> </mapper> ``` 4. 最后，我们需要配置web.xml文件，启动Spring容器和SpringMVC DispatcherServlet。 web.xml： ```xml <web-app> <display-name>MyApp</display-name> <context-param> <param-name>contextConfigLocation</param-name> <param-value>classpath:/config/spring/appConfig.java</param-value> </context-param> <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener> <servlet> <servlet-name>dispatcher</servlet-name> <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> <init-param> <param-name>contextConfigLocation</param-name> <param-value>classpath:/config/spring/webConfig.java</param-value> </init-param> </servlet> <servlet-mapping> <servlet-name>dispatcher</servlet-name> <url-pattern>/</url-pattern> </servlet-mapping> </web-app> ``` 这样，我们就完成了Spring+SpringMVC+MyBatis框架技术的整合。在实际开发中，我们可以根据需求进行修改和调整。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值