easyui datagrid追加削除
フロント表示ページ:grid.html
//バックグラウンドデータ処理ページgrid.ashx
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="easyui/css/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<link href="easyui/css/themes/icon.css" rel="stylesheet" type="text/css" />
<link href="easyui/css/demo.css" rel="stylesheet" type="text/css" />
<link href="easyui/css/dlg.css" rel="stylesheet" type="text/css" />
<script src="easyui/js/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="easyui/js/jquery.easyui.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#tab").datagrid({
title: " ",
iconCls: "icon-save",
width: 600,
height: 300,
collapsible: true,
autoRowHeight: true,
striped: true,
queryParams: { "action": "query" },
url: "grid.ashx",
frozenColumns: [[{ field: "chk", "checkbox": true}]],
columns: [[
{ field: 'JSON_no', title: " ", width: 80 },
{ field: 'JSON_name', title: " ", width: 100 },
{ field: 'JSON_pwd', title: " ", width: 100 },
{ field: 'JSON_sex', title: " ", width: 100 },
{ field: 'JSON_age', title: " ", width: 100 },
{ field: 'JSON_address', title: " ", width: 100 },
]],
// toolbar:"#tool",
toolbar:[{
id:'btnadd',
text:' ',
iconCls:'icon-add',
handler:function(){
$('#btnsave').linkbutton('enable');
add_dg();
}
},{
id:'btnedit',
text:' ',
iconCls:'icon-edit',
handler:function(){
$('#btnsave').linkbutton('enable');
edit_dg();
}
},{
id:'btncut',
text:' ',
iconCls:'icon-no',
handler:function(){
$('#btnsave').linkbutton('enable');
dele_dg();
}
}],
pagination: true,
rownumbers: true,
singleSelect:true
});
////////////// //////////////////
$("#tab").datagrid('getPager').pagination({
beforePageText: ' ',
afterPageText: ' ， {pages} ',
displayMsg: ' {from} - {to} {total} ',
pagesize: 10, //
pageList:[10,15,20,30]
});
})
////////////////////// /////////////////
function dele_dg() {
//********** , (object )
var checked = $("#tab").datagrid('getChecked');
if (checked[0] != null) {
var v = '';
for (var i = 0; i < checked.length; i++) {
v += checked[i].JSON_id + ',';
}
//************ id ','
var str = v.substring(0, v.length - 1);
$.post("grid.ashx", {"action":"del", id: str }, function (data) {
$.messager.alert(' ', data, 'info', function () { $("#tab").datagrid("reload"); });
});
}
}
//////////////////////////// ///////////////////
function add_dg() {
//*********************$('#fm')[0]( dom )
$('#fm_dg')[0].reset();
$('#dd_dg').show();
$('#dd_dg').dialog({
title: ' ',
width: 400,
height: 200,
closed: false,
cache: false,
modal: true,
buttons: [{
text: ' ',
iconCls: 'icon-save',
handler: function () {
var param = $("#fm_dg").serialize();
//
var params = decodeURIComponent(param, true);
$.post("grid.ashx", { "action": "add", data: params }, function (data) {
if (data == 'ok') {
$.messager.show({
title: 'success',
msg: ' ！'
});
$('#tab').datagrid('reload');
} else {
$.messager.show({
title: 'Error',
msg: ' ！'
});
}
$('#tab').datagrid('reload');
$('#dd_dg').window('close');
});
}
}, {
text: ' ',
iconCls: 'icon-cancel',
handler: function () {
$('#dd_dg').window('close');
}
}]
});
}
///////////////////////////// //////////////////////////
function edit_dg() {
var selected = $('#tab').datagrid('getSelected');
if (selected != null) {
$('#dd_dg').show();
//***********
$('#id').val(selected.JSON_id);
$("#no").val(selected.JSON_no);
$('#name').val(selected.JSON_name);
$('#pwd').val(selected.JSON_pwd);
//
if (selected.JSON_sex == " ") {
$("#sex").find("option").eq(0).attr("selected", "selected");
} else {
$("#sex").find("option").eq(1).attr("selected", "selected");
}
$('#age').val(selected.JSON_age);
$('#address').val(selected.JSON_address);
$('#dd_dg').dialog({
title: ' ',
width: 400,
height: 200,
closed: false,
cache: false,
modal: true,//
buttons: [{
text: ' ',
iconCls: 'icon-save',
handler: function () {
var param = $("#fm_dg").serialize();
var params = decodeURIComponent(param, true);
$.post("grid.ashx", { "action":"edit",data:params}, function (data) {
if (data == 'ok') {
$.messager.show({
title: 'success',
msg: ' ！'
});
$('#tab').datagrid('reload');
} else {
$.messager.show({
title: 'Error',
msg: ' ！'
});
}
$('#dg').datagrid('reload');
$('#dd_dg').window('close');
});
}
}, {
text: ' ',
iconCls: 'icon-cancel',
handler: function () {
$('#dd_dg').window('close');
}
}]
});
}
}
</script>
</head>
<body>
<!-- datagrid -->
<table id="tab"></table>
<!-- -->
<div id="dd_dg" style="display:none;" >
<form id="fm_dg" method="post" action="grid.ashx">
<input type="hidden" name="id" id="id"/>
:<input type="text" name="no" id="no" class="easyui-validatebox" required="true"/><br/>
:<input type="text" name="name" id="name" class="easyui-validatebox" required="true"/><br/>
:<input type="password" name="pwd" id="pwd" class="easyui-validatebox" required="true"/><br/>
:<select name="sex" id="sex">
<option value="1"> </option>
<option value="0"> </option>
</select><br/>
:<input type="text" name="age" id="age" class="easyui-validatebox" required="true"/><br/>
:<input type="text" name="address" id="address" class="easyui-validatebox" required="true"/><br/>
</form>
</div>
</body>
</html>//バックグラウンドデータ処理ページgrid.ashx
public class grid : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string action = context.Request["action"].ToString();
switch (action)
{
case "query":
Query();
break;
case "del":
Del();
break;
case "add":
Add();
break;
case "edit":
Edit();
break;
}
}
/// <summary>
///
/// </summary>
private void Query()
{
string str = string.Empty;
string rows = HttpContext.Current.Request["rows"].ToString(); // datagrid
string page = HttpContext.Current.Request["page"].ToString(); // datagrid
// GetTablebyproc ， datat
DataTable dt1 = SqlHelper.GetTablebyproc("pageFileter", int.Parse(rows), int.Parse(page), "stu");
DataTable dt = SqlHelper.GetTable("select * from stu");
str = JSonHelper.CreateJsonParameters(dt1, true, dt.Rows.Count);
HttpContext.Current.Response.Write(str);
}
/// <summary>
///
/// </summary>
private void Del()
{
string str = " ";
string id = HttpContext.Current.Request["id"] != "" ? HttpContext.Current.Request["id"].ToString() : "";
if (id != string.Empty)
{
int num = SqlHelper.DelData("stu", id);
if (num > 0)
{
str = string.Format(" ， {0} ", num.ToString());
}
else
{
str = " ";
}
}
HttpContext.Current.Response.Write(str);
}
/// <summary>
///
/// </summary>
private void Add()
{
StringBuilder sb = new StringBuilder();
foreach (string s in HttpContext.Current.Request.Form.AllKeys)
{
sb.AppendFormat("{0}: {1}
", s, HttpContext.Current.Request.Form[s]);
}
string str = sb.ToString();
string[] str1 = str.Split('&');
string no = str1[1].Split('=')[1];
string name = str1[2].Split('=')[1];
string pwd = str1[3].Split('=')[1];
string sex = str1[4].Split('=')[1]=="1"?" ":" ";
int age = int.Parse(str1[5].Split('=')[1]);
string add = str1[6].Split('=')[1];
string address = add.Substring(0, add.Length - 1);
string sql = string.Format("insert into stu values('{0}','{1}','{2}','{3}',{4},'{5}')", no, name, pwd, sex, age, address);
int count = 0;
count = SqlHelper.ExeNonQuery(sql, CommandType.Text, null) ? 1 : 0;
if (count > 0)
{
HttpContext.Current.Response.Write("ok");
}
else
{
HttpContext.Current.Response.Write("no");
}
}
/// <summary>
///
/// </summary>
private void Edit()
{
StringBuilder sb = new StringBuilder();
foreach (string s in HttpContext.Current.Request.Form.AllKeys)
{
sb.AppendFormat("{0}: {1}
", s, HttpContext.Current.Request.Form[s]);
}
string str = sb.ToString();
string[] str1 = str.Split('&');
int id = int.Parse(str1[0].Split('=')[1]);
string no = str1[1].Split('=')[1];
string name = str1[2].Split('=')[1];
string pwd = str1[3].Split('=')[1];
string sex = str1[4].Split('=')[1] == "1" ? " " : " ";
int age = int.Parse(str1[5].Split('=')[1]);
string add = str1[6].Split('=')[1];
string address = add.Substring(0, add.Length - 1);
string sql = string.Format("update stu set no='{0}',name='{1}',pwd='{2}',sex='{3}',age={4},address='{5}' where id={6}", no, name, pwd, sex, age, address, id);
int count = 0;
count = SqlHelper.ExeNonQuery(sql, CommandType.Text, null) ? 1 : 0;
if (count > 0)
{
HttpContext.Current.Response.Write("ok");
}
else
{
HttpContext.Current.Response.Write("no");
}
}