EasyUi+mvc增删改查
1.首先得下载EasyUi包。
2.前端html代码如下：
@*
For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
ViewBag.Title = "拍卖会列表";
Layout = null;
}
@using Microsoft.AspNetCore.Html
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>518大学生创业拍卖会</title>
<script src="~/js/jquery-2.2.0.min.js"></script>
<script src="~/js/jquery-easyui-1.5.1/jquery.easyui.min.js"></script>
<link href="~/js/jquery-easyui-1.5.1/themes/color.css" rel="stylesheet" />
<link href="~/js/jquery-easyui-1.5.1/demo/demo.css" rel="stylesheet" />
<link href="~/js/jquery-easyui-1.5.1/themes/icon.css" rel="stylesheet" />
<link href="~/js/jquery-easyui-1.5.1/themes/metro/easyui.css" rel="stylesheet" />
<style type="text/css">
#fm {
margin: 0;
padding: 10px 30px;
}
.ftitle {
font-size: 14px;
font-weight: bold;
color: #666;
padding: 5px 0;
margin-bottom: 10px;
border-bottom: 1px solid #ccc;
}
.fitem {
margin-bottom: 5px;
}
.fitem label {
display: inline-block;
width: 80px;
}
</style>
<script type="text/JavaScript">
$(document).ready(function () {
$('#tt').datagrid({
//
width: '100%',
height: '500px',
url: "/test0703/Load", //接收从控制器传回来的load方法的数据
columns: [[
{ field: 'Id', title: '编号' },
{ field: 'MeetName', title: '拍卖会名称', width: 200 },
{ field: 'Creater', title: '发布人', width: 200 },
{ field: 'Desc', title: '简介', width: 200 }
//{ field: 'Remark', title: '备注', width: 200 }
]],
toolbar: [{
text: "添加",
iconCls: "icon-add",
handler: function () {
newStudent();
}
}, "-", {
text: "修改",
iconCls: "icon-edit",
handler: function () {
// edit();
editUser();
}
}, "-", {
text: '删除',
iconCls: 'icon-remove',
handler: function () {
destroyUser();
}
}
],
singleSelect: true,
pagination: true
// rownumbers: true
});
});
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
//添加
function newStudent() {
//清空内容
$('#fm').form('clear');
$('#dlg').dialog('open').dialog('setTitle', '新增');
document.getElementById("test").value = "add";
}
//修改
function editUser() {
var row = $('#tt').datagrid('getSelected');
if (row == null) {
$.messager.alert("提示", "请选择要修改的行！");
}
alert(row.Id);
if (row) {
//获取要修改的字段
$('#MeetName').val(row.MeetName);
$('#Creater').val(row.Creater);
$('#Desc').val(row.Desc);
$('#dlg').dialog('open').dialog('setTitle', '修改');
document.getElementById("test").value = "edit";
$('#fm').form('load', row);
}
}
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
//删除
function destroyUser() {
var rows = $('#tt').datagrid('getSelected');
var row = $('#tt').datagrid('getSelected').Id; //获取点击行ID
if (rows == null) {
$.messager.alert("提示", "请选择要删除的行！");
}
if (row) {
if (!confirm('确定删除吗')) {
return;
}
$.ajax({
type: "delete",
url: "/test0703/Delete/" + row,
contentType: "application/json",
dataType: "json",
async: true,
success: function (result) {
if (result.value.isSuccess) {
// 重新加载数据
$.messager.alert("提示", "删除成功");
$("#tt").datagrid("reload");
}
else {
alert(result.value.msg);
}
}
});
}
}
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -
//保存信息
function saveUser() {
var test = document.getElementById("test").value;
alert(test);
//添加
if (test == "add") {
var data = {};
data.MeetName = $('#MeetName').val();
data.Creater = $('#Creater').val();
data.Desc = $('#Desc').val();
$.ajax({
url: '/test0703/send',
type: 'POST',
data: JSON.stringify(data),
contentType: 'application/json;charset=UTF-8',
success: function (context) {
if (context == "success") {
$.messager.alert("提示", "添加成功");
$('#dlg').dialog('close');
$('#tt').datagrid('reload');
}
else {
$.messager.alert("提示", "添加失败");
return;
}
}
})
}
//修改
else {
var row = $('#tt').datagrid('getSelected');
//if (row) {
// //获取要修改的字段
// var StuId = row.Id;
// alert(StuId);
//}
var StuId = row.Id;
var data = {};
data.MeetName = $('#MeetName').val();
data.Creater = $('#Creater').val();
data.Desc = $('#Desc').val();
data.Id = StuId;
$.ajax({
url: '/test0703/Updateinfo',
type: 'POST',
data: JSON.stringify(data),
contentType: 'application/json;charset=UTF-8',
success: function (context) {
if (context == "success") {
$('#dlg').dialog('close');
$('#tt').datagrid('clearSelections'); //清空选中的行
$.messager.alert("提示", "修改成功");
$('#tt').datagrid('reload');
}
else {
$.messager.alert("提示", "修改失败");
return;
}
}
})
}
}
//-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
//查询
function searchU() {
var name = document.getElementById("serchvalue").value;
$('#tt').datagrid({
iconCls: 'icon-save',
url: "../../ashx/GetData.ashx?action=search&Name=" + name, //接收一般处理程序返回来的json数据
columns: [[
//{ field: 'Id', title: 'ID', width: 100, align: 'center' },
//{ field: 'UserName', title: '姓名', width: 100, align: 'center' }, //field后面就改为你自己的数据表字段，然后可以调整宽度什么的
//{field: 'Query', title: '权限', width: 100, align: 'center' },
//{ field: 'Info', title: '信息', width: 100, align: 'center' },
//{ field: 'Remark', title: '备注', width: 100, align: 'center' }
]],
toolbar: tb,
pagination: true,
rownumbers: true,
fitcolumns: true
});
}
function pagerFilter(data) {
if (typeof data.length == 'number' && typeof data.splice == 'function') { // 判断数据是否是数组
data = {
total: data.length,
rows: data
}
}
var dg = $(this);
var opts = dg.datagrid('options');
var pager = dg.datagrid('getPager');
pager.pagination({
onSelectPage: function (pageNum, pageSize) {
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
pager.pagination('refresh', {
pageNumber: pageNum,
pageSize: pageSize
});
dg.datagrid('loadData', data);
}
});
if (!data.originalRows) {
data.originalRows = (data.rows);
}
var start = (opts.pageNumber - 1) * parseInt(opts.pageSize);
var end = start + parseInt(opts.pageSize);
data.rows = (data.originalRows.slice(start, end));
return data;
}
</script>
</head>
<body>
<input id="test" name="test" type="hidden" />
<table id="tt" class="easyui-datagrid"></table>
<div id="dlg" class="easyui-dialog"
closed="true">
<form id="fm" method="post">
<div class="fitem">
<label>
拍卖会名称
</label>
<input id="MeetName" name="MeetName" class="easyui-validatebox" data-options="required:true" />
</div>
<div class="fitem">
<label>
发布人
</label>
<input id="Creater" name="Creater" class="easyui-validatebox" data-options="required:true" />
</div>
<div class="fitem">
<label>
简介
</label>
<input id="Desc" name="Desc" />
</div>
</form>
<div id="dlg-buttons">
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" onclick="saveUser()">
保存
</a> <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'"
onclick="javascript:$('#dlg').dialog('close')">关闭</a>
</div>
</div>
</body>
</html>
Controller代码：
public string Load()
{
MeetinfoBLL meetbll = new MeetinfoBLL();
MeetinfoDal meetdal = new MeetinfoDal();
List<MeetinfoDal> list = meetbll.GetMeetList(meetdal, null);
//return strJson;
return Newtonsoft.Json.JsonConvert.SerializeObject(list);
}
[HttpDelete]
public JsonResult Delete(int ID)
{
MeetinfoBLL meetbll = new MeetinfoBLL();
MeetinfoDal meetdal = new MeetinfoDal();
bool f = meetbll.Del(ID);
Dictionary<string, object> result = new Dictionary<string, object>();
result.Add("isSuccess", f);
return new JsonResult(Json(result));
}
[HttpPost]
public string send([FromBody] MeetinfoDal data)
{
MeetinfoBLL meetbll = new MeetinfoBLL();
MeetinfoDal meetdal = new MeetinfoDal();
string name = data.MeetName;
string cjr = data.Creater;
string desc = data.Desc; ;
//添加数据
meetdal.MeetName = name;
meetdal.BeginTime = DateTime.Now;
meetdal.Endtime = DateTime.Now;
meetdal.Creater = cjr;
meetdal.Addtime = DateTime.Now;
meetdal.Desc = desc;
bool a = meetbll.AddReturnBool(meetdal);
if (a == true)
{
return "success";
}
else
{
return "false";
}
}
[HttpPost]
public string Updateinfo([FromBody]dynamic data)
{
MeetinfoBLL meetbll = new MeetinfoBLL();
MeetinfoDal meetdal = new MeetinfoDal();
Dictionary<string, object> obj = new Dictionary<string, object>();
obj = HttpHelper.JsonToDictionary(data);
string name = obj["MeetName"].ToString();
string cjr = obj["Creater"].ToString();
string desc = obj["Desc"].ToString();
int id = int.Parse(obj["Id"].ToString());
meetdal = meetbll.GetById(id);
meetdal.Desc = desc;
meetdal.MeetName = name;
meetdal.BeginTime = DateTime.Now;
meetdal.Endtime = DateTime.Now;
meetdal.Creater = cjr;
bool b = meetbll.UpdateReturnBool(meetdal);
if (b == true)
{
return "success";
}
else
{
return "false";
}
}
显示效果截图