javascript-ej1-demos/gantt/defaultContextMenu.html

72 строки
2.7 KiB
HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Essential JS 1 : Gantt</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="../content/bootstrap.min.css" rel="stylesheet" />
<link href="../content/ejthemes/default-theme/ej.web.all.min.css" rel="stylesheet" />
<link href="../content/default.css" rel="stylesheet" />
<link href="../content/default-responsive.css" rel="stylesheet" />
<link href="../content/ejthemes/responsive-css/ej.responsive.css" rel="stylesheet" />
<!--[if lt IE 9]>
<script type="text/javascript" src="../scripts/jquery-1.11.3.min.js" ></script>
<![endif]-->
<!--[if gte IE 9]><!-->
<script src="../scripts/jquery-3.4.1.min.js" type="text/javascript"> </script>
<!--<![endif]-->
<script src="../scripts/jsrender.min.js"></script>
<script src="../scripts/ej.web.all.min.js" type="text/javascript"></script>
<script src="../scripts/properties.js" type="text/javascript"></script>
<script src="../scripts/jsonganttdata.js"></script>
</head>
<body>
<div class="content-container-fluid">
<div class="row">
<div class="cols-sample-area">
<div id="GanttContainer" style="height:450px;width:100%;" />
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
$("#GanttContainer").ejGantt({
dataSource: defaultGanttData,
allowSelection: true,
allowColumnResize: true,
taskIdMapping: "TaskID",
taskNameMapping: "TaskName",
scheduleStartDate: new Date("02/23/2017"),
scheduleEndDate: new Date("03/30/2017"),
startDateMapping: "StartDate",
endDateMapping: "EndDate",
progressMapping: "Progress",
childMapping: "Children",
treeColumnIndex: 1,
enableContextMenu: true,
predecessorMapping: "predecessor",
isResponsive: true,
allowGanttChartEditing: false,
rowHeight: window.theme == "material" ? 48 : window.theme == "office-365" ? 36 : 30,
editSettings: {
allowEditing: true,
allowAdding: true,
allowDeleting: true,
allowIndent: true,
editMode: "cellEditing"
},
load: function () {
this.getColumns()[0].width = window.theme == "material" ? 60 : 30;
}
});
});
</script>
</body>
</html>