편집 제한

특정 셀을 편집 기능이 불가능한 'readonly' 상태로 변경합니다.


요약

특정 셀을 편집 기능이 불가능한 'readonly' 상태로 변경합니다.

입력값

Number : 수정불가 Row Index

Number : 수정불가 Column Index

Boolean : true : 수정불가 / false : 수정불가 해제



예) 단일 셀에 대한 사항 : datagrid1.setCellReadOnly(8,2,true);      다중 셀에 대한 사항 : datagrid1.setCellsReadOnly(1, 0, 5, 6, true);

상세설명

특정 셀이나 행을 ReadOnly 시키면 컬럼이 input 타입일 때 셀 편집 기능을 불가능하게 합니다. 
<!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">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0" />
	<title> SB Grid </title>
	<link href="/kr/co/softbowl/css/Sbgrid_default.css" type="text/css" rel="stylesheet"  />
	<link href="/css/sort.css" type="text/css" rel="stylesheet"  />
	
	<jsp:include page="/view/common/cmCommon.jsp"/>
	<script type="text/javascript" src="/kr/co/softbowl/SBGrid.js"></script>
	<script type="text/javascript" src="/js/jsondata/DATA_JSON_116_people.js"></script>
	<style type="text/css">
		table{border:0px solid #d6d6d6 !important;}
		table th{border:0px solid #d6d6d6 !important;}
		table td{border:0px solid #d6d6d6 !important; }
	</style>
	<script type="text/javascript">
		SBGrid.DEF.DOMAIN = "../../";
		var datagrid1;
		
		$(document).ready(function(){
			__createElements();
		});
		
		
        function __createElements (){
	
			var GridInitInfo = {
									"strParentId" : "sbGridArea",
									"strId": "datagrid1",
									"strCaption": "FirstName^LastName^Company^Address^City^County^State",
									"strColWidth": "100, 100, 200, 200, 150, 130, 70, 100, 110, 110, 250, 300",
									"strJsonRef": "grid_data",
									"strDataHeight":"29",
									"strStyle": "width:100%; height:480px; ",
									"strBackColorAlternate" : "#f7f7f7",
									"strSelectMode" : "free"	
					   };
	
			var SBGridColumnInitInfo = [
											{ "id": "col1", "type": "input", "ref": "FirstName" },
											{ "id": "col2", "type": "input", "ref": "LastName" },
											{ "id": "col3", "type": "input", "ref": "Company" },
											{ "id": "col4", "type": "input", "ref": "Address" },
											{ "id": "col5", "type": "input", "ref": "City" },
											{ "id": "col6", "type": "input", "ref": "County" },
											{ "id": "col7", "type": "input", "ref": "State", "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 readonlycell() {
            datagrid1.clearSelection();
            datagrid1.setCellReadOnly(8, 2, true);
            datagrid1.selectCells(8, 2, 8, 2);
            datagrid1.setCellStyle('background-color', 8, 2, 8, 2, '#D1B2FF');
            datagrid1.clearSelection();
        };

        function readonlycells() {
            datagrid1.clearSelection();
            datagrid1.setCellsReadOnly(1, 0, 5, 6, true);
            datagrid1.selectCells(1, 0, 5, 6);
            datagrid1.setCellStyle('background-color', 1, 0, 5, 6, '#D1B2FF');
            datagrid1.clearSelection();
        };

		
		
		
        function getreadonly(){
            if (nClickedRow == null) {
                nClickedRow = datagrid1.getMouseRow();
                nClickedCol = datagrid1.getMouseCol();
            }

            var bVal = datagrid1.getCellReadOnly(nClickedRow, nClickedCol);
			if(bVal==1)
			{
				alert("반환값 :" + bVal + ", readonly가 설정되어 있습니다.");
			} else if (bVal == 0) {
			{
                alert("반환값 :" + bVal + ", readonly가 설정되어 있지않습니다.");
			} else if (bVal == null) {
                alert("반환값 :" + bVal + ", readonly가 설정되어 있지않습니다.");
            }
		};
		
	</script>
</head>
<body>

    <div id="button_group">
        <input type="button" class="sbgrid_demo_button1" style="width:33%; height:30px;" id="buttonl" value="(8,2) 값 수정 불가" onclick="readonlycell();"/>
        <input type="button" class="sbgrid_demo_button2" style="width:33%; height:30px;" id="button2" value="1행부터 5행까지 수정 불가" onclick="readonlycells();"/>
        <input type="button" class="sbgrid_demo_button3" style="width:33%; height:30px;" id="button3" value="반환값 가져오기" onclick="getreadonly();"/><br/><br/>
    </div>
    <div id="sbGridArea"></div>
		
</body>
</html>