Next
Update
Prev

The Context Menu can be popped up when the user clicks the right mouse button on a row. You can create the Context Menu by defining <ContextMenu> and <ContextMenuItem> in the Layout, and customize its function using JavaScript.

...
<ContextMenu id="cMenu" >
  <ContextMenuItem caption="Insert Row" />
  <ContextMenuItem caption="Delete Row" />
  <ContextMenuItem caption="Remove All" />
  <ContextMenuItem caption="Excel Export" separatorBefore="true" />
  <ContextMenuItem caption="Excel Import" />
</ContextMenu>
...					
					
function contextMenuHandler(caption) {
  if (caption == "Insert Row") {
    var item = {
      "Region": "South",
      "Territory": "Texas",
      "Territory_Rep": "Texas",
      "Actual": 0,
      "Estimate": 0,
      "Real": 0,
      "Price": 0
    };
    var selectedIndex = dataGrid.getSelectedIndex();
    if (collection == null)
      collection = gridRoot.getCollection();
    var dataLength = collection.getLength();
    if (selectedIndex < dataLength)
      gridRoot.addItemAt(item, selectedIndex);
    else
      gridRoot.addItemAt(item);
    } else if (caption == "Delete Row") {
      gridRoot.removeItemAt(dataGrid.getSelectedIndex());
    } else if (caption == "Remove All") {
      if (confirm("Are you sure you want to delete all?"))
        gridRoot.removeAll();
      } else if (caption == "Excel Export") {
        gridRoot.excelExportSave("http://www.koolchart.com/koolgrid/server/saveExcel.php", false);
      } else if (caption == "Excel Import") {
        gridRoot.excelCSVImport(0, "http://www.koolchart.com/koolgrid/server/importCSV.php");
      }
    }
  }

© 2017 KoolChart. All rights reserved.