datagrid之新增删除

一:增加

1、新增一个添加的按钮

<a id="btn-add" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">新增</a>

2、给按钮添加点击事件

$("#btn-add").click(function() {
		//清空之前表单的数据,不必要保存数据
		$('#ff').form('clear');
		$("#dd").dialog("open");
		addFlag=1;
	})

3、在js文件中判断点击事件是否为新增

var addFlag=0/*var一个变量判断*/

4、在表单中提交

function submitForm() {
	/*
	 * 点击确定按钮提交表单到后台,并且是新增/修改共用的一个方法
	 */
	var href=null;
	if(addFlag==2){
//修改
		href=$("#ctx").val()+'/book.action?methodName=edit'
	}else if(addFlag==1){
//增加
		href=$("#ctx").val()+'/book.action?methodName=add'
	}
	$('#ff').form('submit', {
		url:href,    
		success: function(data){
			if(data==1){
				$("#dd").dialog("close");
				$('#dg').datagrid('reload');
			}
		}
	});
 
}

 5、在dao方法和action中新增方法

5.1BookDao

//	增加
	public void add(Book book) throws Exception {
		book.setBid((int)new Date().getTime());
		super.executeUpdate("insert into t_mvc_book values(?,?,?)", book, new String[] {"bid","bname","price"});
	}

5.2BookAction

public String add(HttpServletRequest req, HttpServletResponse resp)  {
		try {
			bookDao.add(book);
			ResponseUtil.writeJson(resp, 1);
		} catch (Exception e) {
			e.printStackTrace();
			try {
				ResponseUtil.writeJson(resp, 0);
			} catch (Exception e1) {
				// TODO Auto-generated catch block
				e1.printStackTrace();
			}
		}
		return null;
	}

6、功能展示 

二:删除

1:单个删除

1.1、在菜单显示的datagrid列里新增一个删除链接

 columns:[[  
	    	{field:'ck',checkbox:true},  
	        {field:'bid',title:'id',width:100},    
	        {field:'bname',title:'名称',width:100},    
	        {field:'price',title:'价格',width:100},
	        {field:'操作',title:'操作',width:100,align:'right',formatter: function(value,row,index){
                    < a href="javascript:void(0);" onclick="del();">删除</a>'
			}}    
 
	    ]]    

1.2、使用ajax新增删除方法

function del() {
	var row=$('#dg').datagrid("getSelected");
	if(row){
		var id=row.bid;
//		messager不能向后台发送请求
		$.messager.confirm('确认','您确认想要删除记录吗?',function(r){    
		    if (r){    
		    	$.ajax({
		    		url:$("#ctx").val()+'/book.action?methodName=del&bid='+id,
		    		success:function(data){
		    			if(data==1){
		    				$('#dg').datagrid('reload');
		    			}
		    		}
		    	});
		    }    
		});  
	}else{
		alert("请选择要删除的数据");
	}
}

1.3、新增dao方法和action方法

1.3.1、dao方法

//	删除
	public void del(Book book) throws Exception {
		super.executeUpdate("delete from t_mvc_book where bid=?", book, new String[] {"bid"});
	}

1.3.2、action代码

public String del(HttpServletRequest req, HttpServletResponse resp)  {
		try {
			
				bookDao.del(book);
			ResponseUtil.writeJson(resp, 1);
		} catch (Exception e) {
			e.printStackTrace();
			try {
				ResponseUtil.writeJson(resp, 0);
			} catch (Exception e1) {
				// TODO Auto-generated catch block
				e1.printStackTrace();
			}
		}
		return null;
	}

1.4、页面展示

2、批量删除

2.1、添加批量删除按钮(userManage.jsp)

<a id="btn-batchDel" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">批量删除</a>

2.2、增加复选框

$('#dg').datagrid({    
	    url:$("#ctx").val()+'/book.action?methodName=datagrid',    
	    pagination:true,
	    fitColumns:true,
//	    添加复选框
	    checkbox:true,
	    toolbar: '#tb',
	    columns:[[  
//	    设置复选框的列
	    	{field:'ck',checkbox:true},  
 
	        {field:'bid',title:'id',width:100},    
	        {field:'bname',title:'名称',width:100},    
	        {field:'price',title:'价格',width:100},
	        {field:'操作',title:'操作',width:100,align:'right',formatter: function(value,row,index){
				return '<a href="javascript:void(0);" onclick="edit();">修改</a>&nbsp;&nbsp;<a href="javascript:void(0);" onclick="del();">删除</a>'
			}}    
 
	    ]]    
	});  

2.3、添加一个批量删除的点击事件

	$("#btn-batchDel").click(function() {
		var rows=$('#dg').datagrid("getSelections");
		var ids=new Array();
		if(rows !=null&& rows.length >0){
			for (var i in rows) {
				ids.push(rows[i].bid)
			}
		}
		if(ids.length>0){
			$.messager.confirm('确认','您确认想要删除记录吗?',function(r){    
			    if (r){    
			    	$.ajax({
			    		url:$("#ctx").val()+'/book.action?methodName=del&bids='+ids.join(","),
			    		success:function(data){
			    			if(data==1){
			    				$('#dg').datagrid('reload');
			    			}
			    		}
			    	});
			    }    
			});  
		}
	});

2.4、Action页面代码修改

public String del(HttpServletRequest req, HttpServletResponse resp)  {
		try {
			String ids = req.getParameter("bids");
			String[] split = ids.split(",");
			for (String s : split) {
				book.setBid(Integer.parseInt(s));
				bookDao.del(book);
			}
			ResponseUtil.writeJson(resp, 1);
		} catch (Exception e) {
			e.printStackTrace();
			try {
				ResponseUtil.writeJson(resp, 0);
			} catch (Exception e1) {
				// TODO Auto-generated catch block
				e1.printStackTrace();
			}
		}
		return null;
	}

2.5、功能展示

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值