1
2
3
4
gridView.setColumnProperty("ImageButton", "alwaysShowButton", "true");
gridView.setColumnProperty("EmployeeID", "alwaysShowButton", "true");
gridView.setColumnProperty("OrderID", "alwaysShowButton", "true");
gridView.setColumnProperty("CustomerID", "alwaysShowButton", "true");

1
2
3
4
gridView.setColumnProperty("ImageButton", "buttonVisibility", "always");
gridView.setColumnProperty("EmployeeID", "buttonVisibility", "always");
gridView.setColumnProperty("OrderID", "buttonVisibility", "always");
gridView.setColumnProperty("CustomerID", "buttonVisibility", "always");

1
2
3
4
gridView.setColumnProperty("ImageButton", "buttonVisibility", "default");
gridView.setColumnProperty("EmployeeID", "buttonVisibility", "default");
gridView.setColumnProperty("OrderID", "buttonVisibility", "default");
gridView.setColumnProperty("CustomerID", "buttonVisibility", "default");

1
2
3
4
gridView.setColumnProperty("ImageButton", "buttonVisibility", "visible");
gridView.setColumnProperty("EmployeeID", "buttonVisibility", "visible");
gridView.setColumnProperty("OrderID", "buttonVisibility", "visible");
gridView.setColumnProperty("CustomerID", "buttonVisibility", "visible");

1
2
3
4
gridView.setColumnProperty("ImageButton", "buttonVisibility", "hidden");
gridView.setColumnProperty("EmployeeID", "buttonVisibility", "hidden");
gridView.setColumnProperty("OrderID", "buttonVisibility", "hidden");
gridView.setColumnProperty("CustomerID", "buttonVisibility", "hidden");

1
2
3
gridView.onMenuItemClicked = function (grid, data) {
    alert(data.label);
};

1
2
3
gridView.onCellButtonClicked = function (grid, itemIndex, column) {
    alert("CellButton Clicked: itemIndex=" + itemIndex + ", fieldName=" + column.fieldName);
};

1
2
3
gridView.onImageButtonClicked = function (grid, itemIndex, column, buttonIndex, name) {
    alert("onImageButtonClicked: " + itemIndex + ", " + column.name+", " + buttonIndex + ", " + name);
};

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
//이미지 버튼 생성
var imageButtons1 = [{
  "name": "팝업버튼",
  "up": "/resource/image/btnImages/popup_normal.png",
  "hover": "/resource/image/btnImages/popup_hover.png",
  "down": "/resource/image/btnImages/popup_click.png",
  "width":50
}];
var imageButtons2 = [{
  "name": "조회버튼",
  "up": "/resource/image/btnImages/search_normal.png",
  "hover": "/resource/image/btnImages/search_hover.png",
  "down": "/resource/image/btnImages/search_click.png",
  "width":50
}];

//이미지 버튼 추가
gridView.addCellRenderers([{
  "id":"buttons1",
  "type":"imageButtons",
  "images": imageButtons1,
  "margin":10
},{
  "id":"buttons2",
  "type":"imageButtons",
  "images": imageButtons2,
  "margin":10
}]);

//컬럼 설정
var columns = [{
  "name": "ImageButton",
  "fieldName": "ImageButton",
  "width": "100",
  "dynamicStyles":[{
    "criteria":["value = '팝업'", "value = '조회'"],
    "styles":["renderer=buttons1", "renderer=buttons2"]
  }],
  "styles": {
   "textAlignment": "near"
  },
  "header": {
    "text": "동적 버튼"
  }
}];

gridView.setColumns(columns);