Checkbox的选中删除功能且Ajax返回后清除所选行
转摘:http://javaweb1024.com/qianduan/jQuery/2015/04/13/544.html
功能描述:多选框勾选以后(全部或者部分),需要想后台提交已勾选的数据(Ajax传输),并删除所选数据。一行的数据是以table来划分,页面要删除本行!
代码 :
存放 checkbox的ID值deleteIds=[];
存放行table数据trs=[];
选中的checkbox:
$targets=$("input[name='id']:checked");
遍历选中的值
$targets.each(function(i,o){
trs.push($(this).closest("table"));
deleteIds.push("deleteId="+$(this).val());
});
Ajax的URL传递方式
url: "deletes.jhtml?"+deleteIds.join("&"),
Ajax返回以后删除选中的行
$(trs).each(function(i,o){
o.remove();
});
最后在Ajax的success中需要清空 deleteIds trs
附全选按钮JS代码:
var $selectAll=$("input.select-all");
$selectAll.click(function(){
var $targets=$("input[name='id']");
if($targets.length>0){
if(this.checked){
$selectAll.attr("checked","checked");
$targets.attr("checked","checked")
}else{
$selectAll.removeAttr("checked","checked");
$targets.removeAttr("checked","checked")
}
}
});
Checkbox的选中删除功能且Ajax返回后清除所选行的更多相关文章
- jquery load加载页面内ajax返回的div不能响应页面js的问题的解决方案
1. 前言 由于项目需要,需要load一个页面并保持ajax返回的div能响应其页面内的JS的click事件.这个不是 解决用jquery load加载页面到div时,不执行页面js的问题 这类问题, ...
- 02 - Unit07:显示笔记下拉菜单、笔记的分享功能、笔记的删除功能
显示笔记下拉菜单 笔记的分享功能 发送Ajax请求 绑定事件:绑定分享按钮单击事件 参数获取:笔记ID 发送请求:/share/add.do 服务器处理 ShareController ShareSe ...
- KingbaseES 数据库删除功能组件
关键字: KingbaseES.卸载.删除功能 一.安装后检查 在安装完成后,可以通过以下几种方式进行安装正确性验证: 1. 查看安装日志,确认没有错误记录; 2. 查看开始菜单: 查看应用程 ...
- ajax“显示弹窗详情”和“删除”功能练习
1.查看详细信息,以弹窗的形式显示,使用ajax 2.批量删除 “查询”功能可以参考前面的文章,这里只讲解ajax“显示弹窗详情”和“删除”功能 第一:在body中的代码 <title>a ...
- ajax中网页传输(一)TEXT——带有删除功能的数据库表格显示练习
网页之间传输的三种方式:TEXT.JSON.XML. 本章将讲解带有TEXT形势的ajax网页传输 第一:body部分代码 <title>ajax中TEXT讲解并且带有删除功能的表格< ...
- Mvc音乐商店demo的ajax异步删除功能总结
刚刚从学校出来参加工作,没啥工作经验,所以各位大神们不要嘲笑哈! 来公司后要进行培训,给我们的作业中有一个使用 dapper+mvc+ajax+SQL Server 2008,来实现一个音乐商店的de ...
- react.js CMS 删除功能的实现
页面效果图: 数据操作分析: 在查询表组件的 TableData.js 中操作如下内容: 给每一行绑定一个checkbox,且在点击这个 checkbox 时,触发 action 中的一个方法(fo ...
- 使用EasyUI实现加入和删除功能
增删该查是不论什么一个项目都少不了的功能操作.这篇博文主要简单介绍一下怎样使用EasyUI实现加入和删除功能. 首先.导入EasyUI的js代码: <link href="~/Easy ...
- 实例:SSH结合Easyui实现Datagrid的批量删除功能
在我先前的基础上面添加批量删除功能.实现的效果如下 删除成功 通常情况下删除不应该真正删除,而是应该有一个标志flag,但flag=true表示状态可见,但flag=false表示状态不可见,为删除状 ...
随机推荐
- python-twisted系列(1)
前言: 这不是一个入门教程.而是知识点的梳理. 开胃图: 这是一个TCP server的“交互图”. reactor 它是Twisted事件处理的核心.包括一些处理网络通讯,线程和事件分派的接口. 一 ...
- 【GoLang】GoLang fmt 占位符详解
golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. # 定义示例类型和变量 type Human struct { Name string } var peo ...
- Dom lesson1
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- codeforces A. New Year Candles 解题报告
题目链接:http://codeforces.com/problemset/problem/379/A 题目意思:给定a支蜡烛(每支蜡烛可以燃烧1小时),可以在燃尽的a支蜡烛中看能组成多少组b支蜡烛, ...
- HDU1850 Being a Good Boy in Spring Festival(博弈)
Being a Good Boy in Spring Festival Time Limit: 1000MS Memory Limit: 32768KB 64bit IO Format: %I ...
- 《Algorithms算法》笔记:优先队列(2)——二叉堆
二叉堆 1 二叉堆的定义 堆是一个完全二叉树结构(除了最底下一层,其他层全是完全平衡的),如果每个结点都大于它的两个孩子,那么这个堆是有序的. 二叉堆是一组能够用堆有序的完全二叉树排序的元素,并在数组 ...
- Codeforces Round #321 (Div. 2)C(tree dfs)
题意:给出一棵树,共有n个节点,其中根节点是Kefa的家,叶子是restaurant,a[i]....a[n]表示i节点是否有猫,问:Kefa要去restaurant并且不能连续经过m个有猫的节点有多 ...
- 发现磁盘的shell
#!/bin/bash #set -x diskarray=(`cat /proc/diskstats |grep -E "\bsd[a-z]\b|\bxvd[a-z]\b|\bvd[a-z ...
- Tomcat热部署和虚拟目录配置
1.Tomcat如何配置热部署 默认就是 <Host appBase="webapps" autoDeploy="true" name="loc ...
- solr使用
到网站上面下载solr http://archive.apache.org/dist/lucene/solr/4.7.2/ 链接: http://archive.apache.org/dist/luc ...