CRUD (Create / Read / Update / Delete)
SBGrid는 DATA를 읽기, 변경, 삭제할 수 있습니다.
요약
SBGrid는 DATA를 읽기, 변경, 삭제할 수 있습니다.입력값
Number : nRow, 이동할 Row Index
String : strType, 위치 유형 ( above : 이전 / below : 이후)
예) 1행 이전에 추가 : datagrid1.insertRow(1, 'above')
상세설명
선택한 행 : datagrid1.selectedRow(0);
선택한 행 추가 : datagrid1.insertRow(datagrid1.selectedRow(0), strType);
선택한 행 삭제 : datagrid1.deleteRow(datagrid1.selectedRow(0));
마지막 행 추가 : datagrid1.addRow();
마지막 행 삭제 : datagrid1.removeRow();
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<meta content="IE=9" http-equiv="X-UA-Compatible">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SoftBowl SBGrid Example</title>
<script type="text/javascript" src="../../kr/co/softbowl/js/Library/json-minified.js"></script>
<script type="text/javascript" src="../../js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../../kr/co/softbowl/js/Library/json2.js"></script>
<script type="text/javascript" src="../../kr/co/softbowl/SBGrid.js"></script>
<script type="text/javascript" src="../../js/DATA_JSON_POI_10.js"></script>
<script type="text/javascript">
SBGrid.DEF.DOMAIN = "../../";
<script>
<script type="text/javascript">
var datagrid1,
datagrid2;
$(document).ready(function(){
__createElements();
});
function __createElements (){
var GridInitInfo = {
"strParentId" : "sbGridArea",
"strId": "datagrid1",
"strCaption": "Longitude^Latitude^Name^City Code^classification",
"strColWidth": "100, 100, 280, 120, 98",
"strJsonRef": "grid_data",
"strStyle": "width:100%; height:480px; ",
"strDataHeight":"29",
"strBackColorAlternate" : "#f7f7f7",
"strExtendLastCol" : "scroll"
};
var SBGridColumnInitInfo =[
{ "id": "col1", "type": "input", "ref": "x", "style" : "text-align:center" },
{ "id": "col2", "type": "input", "ref": "y", "style" : "text-align:center" },
{ "id": "col3", "type": "input", "ref": "name" },
{ "id": "col4", "type": "combo", "ref": "city", "strJsonNodeSet": "combo_city", "strLabelRef": "label", "strValueRef": "value" },
{ "id": "col5", "type": "combo", "ref": "code", "strJsonNodeSet": "combo_code", "strLabelRef": "label", "strValueRef": "value", "style" : "text-align:center" }
];
if(SBGrid.getGrid('datagrid1') != null){
datagrid1.destroy();
datagrid1 = null;
}
datagrid1 = createSBGrid(GridInitInfo,SBGridColumnInitInfo);
}
function createSBGrid(SBGridInitInfo, SBGridColumnInitInfo){
var objJSONdata = new Object();
objJSONdata.objSBGridInitInfo = SBGridInitInfo;
objJSONdata.arSBGridColumnInitInfo = SBGridColumnInitInfo;
return SBGrid.DEF.createSBGrid(objJSONdata);
};
function addRow(){
datagrid1.addRow();
}
function InsertRow(strAddType){
datagrid1.insertRow( datagrid1.selectedRow(0) ,strAddType);
}
function removeRow(){
datagrid1.removeRow();
}
function deleteRow(){
datagrid1.deleteRow( datagrid1.selectedRow(0));
}
function getData(){
var strValue = "(3,2)cell's Data is ";
strValue += datagrid1.getTextMatrix(3, 2);
alert(strValue);
}
function setData(){
datagrid1.setTextMatrix(3, 2, "Data가 변경되었습니다.");
datagrid1.refresh();
}
</script>
</head>
<body onload="__createElements()" class="sbgrid_body">
<div id="button_group">
<input type="button" class="sbgrid_demo_button" style="width:230px;height:30px;" id="button_Add_Row" value="마지막 행 다음 위치에 행 추가" onclick="addRow();"></input>
<input type="button" class="sbgrid_demo_button" style="width:230px;height:30px;" id="button_Insert_Row_above" value="선택한 행 이전 위치에 행 추가" onclick="InsertRow('above');"></input>
<input type="button" class="sbgrid_demo_button" style="width:231px;height:30px;" id="button_Insert_Row_below" value="선택한 행 다음 위치에 행 추가" onclick="InsertRow('below');"></input>
<input type="button" class="sbgrid_demo_button" style="width:230px;height:30px;" id="button_Delete_Row" value="선택된 행 삭제" onclick="deleteRow();"></input>
<input type="button" class="sbgrid_demo_button" style="width:230px;height:30px;" id="button_getDataOfCell" value="(3,2)Cell의 Data 가져오기" onclick="getData();"></input>
<input type="button" class="sbgrid_demo_button" style="width:231px;height:30px;" id="button_setDataOfCell" value="(3,2)Cell의 Data 설정하기" onclick="setData();"></input>
</div>
<div class="content_group">
<div id="sbGridArea"></div>
</div>
</body>
</html>