   {id: 'token', name: 'Token', field: 'name', width: 100, editor: Slick.Editors.Text, validator: requiredFieldValidator, sortable: true},
   {id: 'description', name: 'Description', field: 'description', width: 200, editor: Slick.Editors.Text},
   {id: 'environment', name: 'Environment', field: 'environment', width: 200, sortable: true, editor: Slick.Editors.Text},
-  {id: 'value', name: 'Value', field: 'value', width: 200, editor: Slick.Editors.Text}];
-
+  {id: 'value', name: 'Value', field: 'value', width: 200, editor: Slick.Editors.Text},
+  {id: 'source', name: 'Source', field: 'source', width: 400, sortable: true},
+  {id: 'delete', name: 'Delete', field: 'delete', width: 200, formatter: deleteButtonFormatter}];
+
+
+function deleteButtonFormatter(row, cell, value, columnDef, dataContext) {
+  var button = \"<input class='del' type='button' id='\" + dataContext.name + \"' />\";
+  return button;
+}
 
   var options = {
     editable: true,
-    enableAddRow: true,
+    enableAddRow: false,
     enableCellNavigation: true,
     autoEdit: false,
     autoHeight: true
    };
 
-
-
 var loadingIndicator = null;
 
 $(function () {
 
-var dv = Slick.Data.DataView();
+dv = Slick.Data.DataView();
 var gridSorter = function(columnField, isAsc, grid, gridData) {
     var sign = isAsc ? 1 : -1;
     var field = columnField

    [:script {:type "text/javascript"}
     (str "
var grid;

function requiredFieldValidator(value) {
  if (value == null || value == undefined || !value.length) {


grid.onAddNewRow.subscribe(function (e, args) {
  var item = args.item;
  grid.invalidateRow(dv.length);
  dv.addItem(item);
  grid.updateRowCount();
  grid.render();
});

