前言
本章给大家分享的是datagrid增删改实现步骤。
效果图展示
增加页面效果展示
修改页面效果展示
增删改实现步骤
实现增加
1.dao方法
public int add(Book book) throws NoSuchFieldException, SecurityException, IllegalArgumentException, IllegalAccessException, SQLException {
//拼音的属性值不是从jsp传递过来的
book.setPinyin(PinYinUtil.getAllPingYin(book.getName()));
//从前端把jsp传到后端的depioyTime属性是String类型,而数据库需要的是timestamp
//SimpleDateFormat sdt=new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
String sql="insert into t_easyui_book values(null,?,?,?,?,?,?,?,?,?,?,?)";
return super.executeUpdate(sql, book, new String[] {
"name","pinyin","cid","author","price","image","publishing","description","state","deployTime","sales"});
}
2.Action代码
public String add(HttpServletRequest req,HttpServletResponse resp) {
try {
int n = this.bookdao.add(book);
ResponseUtil.writeJson(resp,DataGridResult.SUCCESS);
} catch (NoSuchFieldException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SecurityException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
3.js代码
//给新增按钮绑定点击事件
$("#btn-add").click(function(){
$("#bookEdit").dialog('open');
});
$("#btn-save").click(function(){
$('#ff').form('submit', {
url:ctx+'/book.action?methodName=add',
onSubmit:function(){
//consloe.log('onsubmit.....');
},
success:function(data){
data= eval('('+data+')');
//debugger;
if(data.code == 200){
alert(data.msg)
//刷新数据表格数据
$('#ff').form('clear');
$("#bookEdit").dialog('close');
$('#dg').datagrid('reload');
}
}
});
//$('#ff').submit();
});
})
4.jsp页面
<div id="bookEdit" class="easyui-dialog" title="书籍信息编辑窗体" style="width:400px;height:300px;"
data-options="iconCls:'icon-save',resizable:true,modal:true,closed:true,buttons:'#fbtns'">
<form id="ff" method="post">
<input type="hidden" name="id">
<div>
<label for="name">书籍名称:</label>
<input class="easyui-validatebox" type="text" name="name" data-options="required:true" />
</div>
<div>
<label for="cid">书籍类别:</label>
<input class="easyui-validatebox" type="text" name="cid" data-options="required:true" />
</div>
<div>
<label for="author">作者:</label>
<input class="easyui-validatebox" type="text" name="author" data-options="required:true" />
</div>
<div>
<label for="name">书籍名称:</label>
<input class="easyui-validatebox" type="text" name="name" data-options="required:true" />
</div>
<div>
<label for="cid">书籍类别:</label>
<input class="easyui-validatebox" type="text" name="cid" data-options="required:true" />
</div>
<div>
<label for="author">作者:</label>
<input class="easyui-validatebox" type="text" name="author" data-options="required:true" />
</div>
<div>
<label for="price">价格:</label>
<input class="easyui-validatebox" type="text" name="price" data-options="required:true" />
</div>
<div>
<label for="image">图片地址:</label>
<input class="easyui-validatebox" type="text" name="image" data-options="required:true" />
</div>
<div>
<label for="publishing">出版社:</label>
<input class="easyui-validatebox" type="text" name="publishing" data-options="required:true" />
</div>
<div>
<label for="description">描述:</label>
<input class="easyui-validatebox" type="text" name="description" data-options="required:true" />
</div>
<div>
<label for="state">物流状态:</label>
<input class="easyui-validatebox" type="text" name="state" data-options="required:true" />
</div>
<div>
<label for="deployTime">发布时间:</label>
<input class="easyui-validatebox" type="text" name="deployTime" data-options="required:true" />
</div>
<div>
<label for="sales">数量:</label>
<input class="easyui-validatebox" type="text" name="sales" data-options="required:true" />
</div>
</form>
<div id="fbtns">
<a id="btn-save" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-serch'">保存</a>
<a id="btn-cancel" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-serch'">取消</a>
</div>
</div>
实现修改
1.dao方法
public int edit(Book book) throws NoSuchFieldException, SecurityException, IllegalArgumentException, IllegalAccessException, SQLException {
book.setPinyin(PinYinUtil.getAllPingYin(book.getName()));
String sql="update t_easyui_book set name=?,pinyin=?,cid=?,author=?,price=?,image=?,publishing=?,description=?,state=?,deployTime=?,sales=?";
return super.executeUpdate(sql, book, new String[] {
"name","pinyin","cid","author","price","image","publishing","description","state","deployTime","sales"});
}
2.Action代码
public String edit(HttpServletRequest req,HttpServletResponse resp) {
try {
this.bookdao.edit(book);
} catch (NoSuchFieldException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SecurityException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
3.js代码
function edit(){
//做数据回显,就是将值选择的datagrid回填到from表单
var row=$('#dg').datagrid("getSelected");
if(row){
$('#ff').form('load',row);
}
//让用户看到form表单
$("#bookEdit").dialog('open');
}
实现删除
1.dao方法
public int del(Book book) throws NoSuchFieldException, SecurityException, IllegalArgumentException, IllegalAccessException, SQLException {
String sql="delete from t_easyui_book where id=?";
return super.executeUpdate(sql, book, new String[] {
"id"});
}
2.Action代码
public String del(HttpServletRequest req,HttpServletResponse resp) {
try {
this.bookdao.del(book);
try {
ResponseUtil.writeJson(resp,DataGridResult.SUCCESS);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}} catch (NoSuchFieldException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SecurityException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return null;
}
js代码
function del(){
var row=$('#dg').datagrid("getSelected");
if(row){
$.ajax({
url:ctx+'/book.action?methodName=del&&id='+row.id,
success:function(data){
data= eval('('+data+')');
//debugger;
if(data.code == 200){
alert(data.msg)
//刷新数据表格数据
$('#dg').datagrid('reload');
}
}
})
}
}
本章就分享到这,如果小伙伴们有什么问题欢迎在下方留言!