jquery bootgrid框架整合了html5等新特性,介面效果等還是比較不錯的,所以今天主要總結一下它和後台的互動過程。
一. 首先看它的格式
,
,...
],"total": 1123
}
這就是它的json格式,引數主要是有這些
current=1&rowcount=10&sort[sender]=asc&searchphrase=&id=b0df282a-0d67-40e5-8558-c9e93b7befed
後台只需接收其引數即可
二. 很顯然,這是json資料格式,所以後台也得是json資料格式,然後才能接收其引數。
(1). 在xml配置檔案中寫json名稱
name="devicelist"
class="devicequeryaction"
method="devicelist">
type="json">
name="root">mapdataparam>
result>
action>
(2). 然後後台接收前台引數
private mapmapdata;
private
int current; //當前頁
private
int rowcount; //當前頁顯示的條數
this.pagebean=this.devicequeryservice.devicequerylist(current, rowcount,sort);
mapdata.put("current", current);
mapdata.put("rowcount", rowcount);
mapdata.put("rows",this.pagebean.getlist());
mapdata.put("total", this.pagebean.gettotalrecord());
public mapgetmapdata()
public
void
setmapdata(mapmapdata)
public
intgetcurrent()
public
void
setcurrent(int current)
public
intgetrowcount()
public
void
setrowcount(int rowcount)
三. 前台傳的值和介面css
"grid" class=
"table table-condensed table-hover table-striped table-bordered"
>
-column
-id=
"1111"
data
-identifier
="true"
data
-type
="numeric"
>
1111
-column
-id=
"2222"
>
2222
-column
-id=
"3333"
>
3333
-column
-id=
"4444"
>
4444
js部分
ajax: true,
url: "",
selection: true,
multiselect: true,
rowselect: true,
keepselection: true,
rowcount: [10, 25, 15, -1]
四. 介面效果
ok,jquery bootgrid介面就大功告成了,下節將會給大家講解模糊搜尋功能,希望大家多多關注,如有不足之處,希望大家多多支援。
jquery bootgrid的排序功能
上次講解了jquery bootgrid和後台的互動過程,想必大家對bootgrid都有了一定的了解。這次我們來看下它的排序功能。jquery bootgrid自帶排序功能,例如sort id desc 所以我們後台直接接收值即可。首先是dao層,得寫上乙個引數,然後拼接到sql上 override...
js彈出提問框訊息框警告框
警告 alert 在訪問 的時候,你遇到過這樣的情況嗎?咚 的一聲,乙個小視窗出現在你面前,上面寫著一段警示性的文字,或是其它的提示資訊。如果你不點選確定,你就不能對網頁做任何的操作。沒錯,這個 咚 的小視窗就是alert幹的。下面的 是一段使用alert的例項。我的個人觀點是盡量少使用alert,...
MFC 組合框,列表框
組合框 ccombobox 列表框 clistbox 組合框 combo box 列表框 list box 屬性中 sort 支援自動排序 1.新增如圖空間,並聲稱對應的組合框和列表框 編輯框的控制項。2.新增 新增 刪除 函式 void clb007dlg onbnclickedbtnadd vo...