셀 버튼

셀 버튼은 column.button = action 으로 지정하면 사용할 수 있습니다.

  var columns = [
    {
      name: "KorName",
      fieldName: "KorName",
      width: "100",
      header: {
        text: "이름",
        styleName: "orange-column",
      },
      button:"action",
      buttonVisibility: "always"
    },
    ...
  ];

  gridView.setColumns(columns);

버튼 클릭 이벤트

셀버튼 클릭 이벤트

• onCellButtonClicked

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

셀 버튼을 다루는 다른 방법

• always: 항상 표시
• default: hovering, focused상태에서 표시
• visible: focused상태만 표시
• hidden: 표시하지 않음

gridView.columnByName("KorName").buttonVisibility = "always";

gridView.columnByName("KorName").buttonVisibility = "default";

gridView.columnByName("KorName").buttonVisibility = "visible";

gridView.columnByName("KorName").buttonVisibility = "hidden";

버튼 렌더러

버튼 렌더러는 renderer.type = "button" 으로 지정하면 사용할 수 있습니다.

현재 셀의 값이 버튼에 표시됩니다.

{
  name: "KorCountry",
  fieldName: "KorCountry",
  width: "100",
  header: {
    text: "투자국가",
    styleName: "orange-column"
  },
  editable:false,
  renderer:{
      type:"button"
  }
}

버튼 렌더러 클릭 이벤트

gridView.onCellItemClicked = function (grid, index, clickData) {
  alert(clickData.value + " 버튼이 클릭 되었습니다.")
  return true;
}