jquery easyui 右鍵選單
阿新 • • 發佈：2018-12-16
本帖最後由 lishunwen0825 於 2013-03-01 12:23:39 編輯
如下圖：
我想檢視單行資料（如ID為20）的右鍵上獲取該行的值，程式碼：
JavaScript code ?
右鍵選單：
XML/HTML code ?
javascript:
JavaScript code ?
我想檢視單行資料（如ID為20）的右鍵上獲取該行的值，程式碼：
JavaScript code ?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
<script type=
"text/javascript"
>
$(
function
(){
$(
'#test'
).datagrid({
title:
'DataGrid資料列表'
,
iconCls:
'icon-grid'
,
fit:
true
,
collapsible:
true
,
closable:
true
,
nowrap:
false
,
animate:
true
,
url:
'<%=rootPath%>data/getJobs'
,
idField:
'id'
,
pagination:
true
,
pageSize:20,
pageList: [10,20,30,40,50,100],
onRowContextMenu: onRowContextMenu,
//右鍵。[表頭(tab)右鍵onHeaderContextMenu,樹形(tree)右鍵onContextMenu]
rownumbers:
true
,
singleSelect:
true
,
columns:[[
{title:
''
,field:
'ck'
,width:120,checkbox:
true
},
{field:
'id'
,title:
'崗位ID'
,width:80},
{field:
'job_name'
,title:
'崗位名稱'
,width:80},
{field:
'dat'
,title:
'入職日期'
,width:80,align:
'right'
},
{field:
'work_address'
,title:
'工作地點'
,width:80},
{field:
'salary'
,title:
'薪資'
,width:80,align:
'right'
},
{field:
'status'
,title:
'狀態'
,width:60},
]],
onLoadSuccess:
function
() {
delete
$(
this
).datagrid(
'options'
).queryParams[
'id'
];
}
});
});
</script>
|
右鍵選單：
XML/HTML code ?
| 1 2 3 4 5 6 7 8 9 |
<
div
id
=
"mm"
class
=
"easyui-menu"
style
=
"width:120px;"
>
<
div
onClick
=
"view()"
data-options
=
"iconCls:'icon-search'"
>檢視</
div
>
<
div
onClick
=
"add()"
data-options
=
"iconCls:'icon-add'"
>新增</
div
>
<
div
onClick
=
"edit()"
data-options
=
"iconCls:'icon-edit'"
>編輯</
div
>
<
div
onClick
=
"del()"
data-options
=
"iconCls:'icon-remove'"
>刪除</
div
>
<
div
class
=
"menu-sep"
></
div
>
<
div
onClick
=
"print()"
data-options
=
"iconCls:'icon-print'"
>列印</
div
>
<
div
onClick
=
"reload()"
data-options
=
"iconCls:'icon-reload'"
>重新整理</
div
>
</
div
>
|
javascript:
JavaScript code ?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
//新增右擊選單內容
function
onRowContextMenu(e, rowIndex, rowData){
e.preventDefault();
var
selected=$(
"#test"
).datagrid(
'getRows'
);
//獲取所有行集合物件
selected[rowIndex].id;
//index為當前右鍵行的索引，指向當前行物件
$(
'#mm'
).menu(
'show'
, {
left:e.pageX,
top:e.pageY
});
}
//檢視詳細
function
view(){
/***
就是這裡獲取單行資料方法????
treeGrid上倒是很好實現:
var node = $('#datagrid').treegrid('getSelected');
if(node){
........
}
***/
}
|