데이터 수정
그리드의 gridView.editOptions.editable이 true이면 사용자는 행 편집을 할 수 있습니다. 편집 중 Esc키로 셀 편집을 취소할 수 있고, 셀 편집 중이 아닌 상태에서 Esc키를 누르면 행 편집이 취소됩니다.
또, 편집된 값들이 DataProvider에 전달된 시점(dataProvider.onRowUpdating())과 DataProvider에 저장 완료된 시점(dataProvider.onRowUpdated())에 각각 callback을 지정할 수 있습니다.
또한 개발자가 GridView.beginUpdateRow() 메소드를 통해 사용자가 편집을 시작할 수 있습니다.
편집 가능 설정
그리드에서 편집을 가능하게 하려면 setEditOptions()을 사용하여 editable, updatable 속성을 true로 지정하면 됩니다. 해당 속성의 기본값은 true 입니다.
gridView.setEditOptions({
editable: true,
updatable: true
});
편집
beginUpdateRow()를 통한 편집
var curr = gridView.getCurrent();
gridView.beginUpdateRow(curr.itemIndex);
gridView.showEditor();
gridView.setFocus();
DataProvider에 편집 값이 전달된 시점
그리드에서 편집이 완료되면 편집된 값들은 dataProvider에 전달이 됩니다. 이때 dataProvider.onRowUpdating() 이벤트가 발생하며 false를 리턴하면 편집이 취소 됩니다.
dataProvider.onRowUpdating = function(provider, row) {
var item = gridView.getEditingItem(); // 현재 편집 중인 행 정보와 값을 가져옵니다.
if (item) {
if (item.values["Age"] <= 100) {
setTimeout(function() {
alert("Age must be greater than 100 !");
}, 10);
return false; // false를 리턴하면 DataProvider에 저장되지 않습니다.
}
}
return true;
};
DataProvider에 편집 값이 저장 완료된 시점
편집이 완료되면 dataProvider.onRowUpdating() 발생 후 dataProvider에 저장이 완료되면 dataProvider.onRowUpdated()가 발생 합니다.
dataProvider.onRowUpdated = function(provider, row) {
var r = provider.getJsonRow(row);
alert(JSON.stringify(r));
};