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>