<link rel="stylesheet" type="text/css" href="../../../dhtmlxMenu/codebase/skins/dhtmlxmenu_dhx_skyblue.css">
<script src="../../../dhtmlxMenu/codebase/dhtmlxcommon.js"></script>
<script src="../../../dhtmlxMenu/codebase/dhtmlxmenu.js"></script>
<script src="../../codebase/dhtmlxdataview.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxdataview.css">  
<style type="text/css" media="screen">
    html, body { 
        height:100%;
        };
</style>
 
<div id="data_here" style="height:400px">
</div>
<script>
function doOnLoad() {
    menu = new dhtmlXMenuObject("contextArea");
    menu.setIconsPath("../../../dhtmlxMenu/samples/common/imgs/");
    menu.renderAsContextMenu();
    menu.loadXML("../../../dhtmlxMenu/samples/common/dhxmenu.xml");
 
    data = new dhtmlXDataView({
        container: "data_here",
        type: {
            template: "#Package# : #Version#<br/>#Maintainer#",
            padding: 5,
            height: 40;
        },
        x_count: 3;
    });
    data.attachEvent("onBeforeContextMenu", function(id, e) {
        menu._doOnContextBeforeCall(e, {
            id: id
        });
        data.select(id);
        return false;
    });
    data.load("../common/data.xml");
};</script>