Forum
19:02
19/10/2012
Hello
I'm trying to get a context menu in a treegrid. The code works fine if I use a normal grid instead:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" />
<link rel="stylesheet" type="text/css" media="screen" href="/blog/jqgrid/themes/ui.jqgrid.css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript">
</script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript">
</script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/jquery.contextmenu.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.9.0.custom.min.js" type="text/javascript"></script>
<style type="text/css">
#jqContextMenu li
{
white-space:nowrap;
}
#jqContextMenu, #jqContextMenu ul
{
width: 300px !important;
}
</style>
<script type="text/javascript">
$(function () {
'use strict';
var data=[
{ id: "1", Aktion: "Aktion 1", Datum: "10.1.2012", level: "0", parent: "null", isLeaf: false, expanded: false },
{ id: "2", Aktion: "Aktion 2", Datum: "9.1.2012", level: "1", parent: "1", isLeaf: false, expanded: false },
{ id: "5", Aktion: "Aktion 5", Datum: "7.1.2012", level: "2", parent: "2", isLeaf: true, expanded: false },
{ id: "4", Aktion: "Aktion 4", Datum: "6.1.2012", level: "1", parent: "1", isLeaf: true, expanded: false },
{ id: "3", Aktion: "Aktion 3", Datum: "8.1.2012", level: "0", parent: "null", isLeaf: true, expanded: false },
];
var eventsMenu = {
bindings: {
'Löschen': function (t) {
callContextMenu(t.id, 'Löschen');
},
'NeuEMail': function (t) {
callContextMenu(t.id, 'Neu E-Mail');
},
'NeuAufgabe': function (t) {
callContextMenu(t.id,'Neu Aufgabe');
}
}
};
var grid = $("#treegrid");
grid.jqGrid({
datatype: 'local',
treeGrid: true,
treeGridModel: 'adjacency',
treedatatype: 'local',
ExpandColumn: 'Aktion',
toolbar: [true, "bottom"],
colNames: ["id", "Aktion", "Datum"],
colModel: [{
name: 'id',
index: 'id',
width: 1,
hidden: true,
key: true
}, {
name: 'Aktion',
index: 'Aktion',
width: 120,
hidden: false,
sorttype: 'text',
},
{
name: 'Datum',
index: 'Datum',
width: 120,
hidden: false,
sortable: true,
sorttype: 'date'
}, ],
width: 500,
sortname: 'id',
pager: false,
imgpath: '/ui-lightness/images',
caption: '',
loadonce: true,
afterInsertRow: function (rowid, rowdata, rowelem) {
$('#' + rowdata["id"]).contextMenu('MenuJqGrid', eventsMenu);
}
}
})
grid[0].addJSONData({ total: 5, page: 1, records: data.length, rows: data });
</script>
</head>
<body><br />
<div id="message"></div><br />
<table id="treegrid" class="scroll" ><tr><td></td></tr>
</table>
<br />
<table id="grid" class="scroll" ><tr><td></td></tr>
</table>
<div class="contextMenu" id="MenuJqGrid" >
<ul>
<li id="Löschen">
<img src="themes/contextMenu/edit.png" />
Löschen</li>
<li id="NeuEMail" >
<img src="themes/contextMenu/cut.png" />
Neu: E-Mail</li>
<li id="NeuAufgabe">
<img src="themes/contextMenu/copy.png" />
Neu: Aufgabe</li>
</ul>
</div>
</body>
</html>
Any idea? Kind regards
Mike
Most Users Ever Online: 715
Currently Online:
69 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66