SlickGrid은 JavaScript로 작성된 강력한 그리드 컨트롤입니다. 이 그리드에서 행을 동적으로 추가하거나 삭제하는 방법을 살펴보겠습니다.

행 추가

새로운 행을 추가하려면 다음 단계를 따르십시오:

1. SlickGrid 데이터 소스에 새로운 객체를 추가합니다. 이 객체는 그리드의 각 열에 대한 값을 가지고 있어야 합니다.

var newDataItem = {
  id: "newId",
  column1: "value1",
  column2: "value2",
  // 다른 열에 대한 값도 추가
};

dataView.addItem(newDataItem);

1. dataView의 addItem 메소드를 사용하여 데이터 소스에 새로운 행을 추가합니다.

2. 그리드를 다시 렌더링하여 새로운 행이 표시되도록 업데이트합니다.

grid.invalidateRow(dataView.getLength());
grid.render();

위의 단계를 따라하면 SlickGrid에 새로운 행이 추가됩니다.

행 삭제

행을 삭제하려면 다음 단계를 따르십시오:

1. 삭제하려는 행의 인덱스를 찾습니다.

2. dataView에서 해당 행을 제거합니다.

dataView.deleteItem(rowIndex);

1. 그리드를 다시 렌더링하여 행이 삭제되도록 업데이트합니다.

grid.invalidateRow(rowIndex);
grid.render();

위의 단계를 따라하면 SlickGrid에서 행이 삭제됩니다.

요약

SlickGrid을 사용하여 행을 동적으로 추가하고 삭제하는 방법에 대해 알아보았습니다. 이를 활용하면 사용자가 그리드에 데이터를 쉽게 추가하거나 삭제할 수 있습니다.

더 자세한 내용은 SlickGrid 공식 문서를 참조하세요.