mysql使用jtable_jtable 的简单使用
做后臺(tái)管理管理系統(tǒng)時(shí)，基于ajax的數(shù)據(jù)操作和富有表現(xiàn)力的數(shù)據(jù)綁定插件jtable絕對(duì)是一個(gè)不錯(cuò)的選擇，他接收來自服務(wù)器端的json格式的數(shù)據(jù)。而且他是一款開源的基于jquery和jquery ui的插件，您可以根據(jù)自己的需要修改其表現(xiàn)，如css，甚至修改其源碼，讓其符合您的需求。
下面我將介紹在asp.net mvc3.0 和ssh框架下jtable的使用
2 將相應(yīng)的css (jtable.css)和jquery.jtable.zh-CN.js、jquery.jtable.min.js拷到您的項(xiàng)目下。
3?引入插件，在view中，一般放在模板頁(yè)中，為了簡(jiǎn)單，我放在AdministratorController下的Index Action對(duì)應(yīng)的視圖中，即Index.aspx頁(yè)面中
4 編寫javascript代碼綁定數(shù)據(jù)
$("#smallTypeList").jtable({
title:"商品小類別管理列表",
paging:true,
pageSize:10,
selecting:true, //Enable selecting
multiselect: true, //Allow multiple selecting
selectingCheckboxes: true,
actions: {
listAction:"/Administrator/GoodsSmallTypeList",
createAction:"/Administrator/GoodsSmallTypeCreate",
updateAction:'/Administrator/GoodsSmallTypeUpdate',
deleteAction:'/Administrator/GoodsSmallTypeDelete'},
fields: {
sid: {
key:true,
list:false,
create:false,
edit:false},
sname: {
title:"名稱",
width:"30%",
inputClass:"validate[required]"},
cid: {
title:"類別",
width:"30%",
options:"/Administrator/CateList"},
spic: {
title:"類別圖片",
width:"30%",
options: {'暫無(wú)':'暫無(wú)'}
}});
$("#smallTypeList").jtable("load");
});
5 在controller中輸出json
為了簡(jiǎn)單，省略Models層的代碼，筆者認(rèn)為您已經(jīng)具備一定的asp.net mvc的基礎(chǔ)知識(shí)。
綁定數(shù)據(jù)，注意參數(shù)(jtableStartIndex,jtPageSize)
第一個(gè)參數(shù)用來指定當(dāng)前起始記錄，第二個(gè)用來指定一頁(yè)顯示的記錄行，用這兩個(gè)參數(shù)實(shí)現(xiàn)分頁(yè)。
public JsonResult GoodsSmallTypeList(int jtStartIndex, intjtPageSize)
{try{int totalCount =goodscateEntity.getAllCategorys().Count();var goodsSmallList =goodscateEntity.getAllCategorys().Skip(jtStartIndex).Take(jtPageSize);return Json(new { Result = "OK", Records = goodsSmallList, TotalRecordCount =totalCount });
}catch(Exception ex)
{return Json(new { Result = "ERROR", Message =ex.Message.ToString() });
}
}
代碼中,返回json時(shí)參數(shù)的OK表示請(qǐng)求狀態(tài)，Records表示數(shù)據(jù)集合，TotalRecordCount表示總記錄數(shù)。一般這些參數(shù)的約定好的，不可改成其他，除非你不愿意使用。您可以在jtable源碼中進(jìn)行修改。
publicJsonResult GoodsSmallTypeCreate(tb_goodsCategory category)
{try{if (!ModelState.IsValid)
{return Json(new { Result = "ERROR", Message = "請(qǐng)?zhí)顚懶畔⑼暾?#34;});
}bool l =goodscateEntity.InsertGoodsCategory(category);return Json(new { Result = "OK", Record =category });
}catch(Exception ex)
{return Json(new { Result = "ERROR", Message =ex.Message.ToString() });
}
}///
///修改商品類型///
///
///
publicJsonResult GoodsSmallTypeUpdate(tb_goodsCategory category)
{try{bool l =goodscateEntity.ModifyGoodsCateGory(category);return Json(new { Result = "OK", Record =category });
}catch(Exception ex)
{return Json(new { Result = "ERROR", Message =ex.Message.ToString() });
}
}///
///刪除商品類型///
///
///
public JsonResult GoodsSmallTypeDelete(int?sid)
{try{bool l =goodscateEntity.DeleteGoodsCategory(sid);return Json(new { Result = "OK"});
}catch(Exception ex)
{return Json(new { Result = "ERROR", Message =ex.Message.ToString() });
}
}
運(yùn)行結(jié)果：
這樣，jtable的使用描述就此完成，本人技術(shù)有限，文中還有許多不足，希望大家批評(píng)指正，謝謝。
使用 SSH很簡(jiǎn)單，只要的struts.xml加入相關(guān)配置，使其返回的數(shù)據(jù)為json即可。?當(dāng)然要引入json對(duì)應(yīng)的jar包哦。希望對(duì)大家有用。
總結(jié)
以上是生活随笔為你收集整理的mysql使用jtable_jtable 的简单使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： UML在线画图工具ProcessOn
- 下一篇： es6 --- Thunk函数的作用