Cell 선택모드

SBGrid는 셀을 선택하는 방식 설정 기능을 제공합니다.

(* Default 값은 셀 선택 'free' 입니다.)


요약

셀을 선택하는 방식을 설정합니다.

입력값

String 선택 유형


예) "strSelectMode" : "byrow"

상세설명

선택유형은 아래와 같습니다.

byrow 행 단위로 선택을 합니다. ctrl 키를 이용하여 다중행을 선택할 수 없습니다.


bycol 열 단위로 선택을 합니다.


listbox 행 단위로 선택을 합니다. ctrl 키를 이용하여 다중행을 선택할 수 있습니다.


free 셀 단위로 자유롭게 선택할 수 있습니다.

<!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_Merge.js"></script>
		
	<script type="text/javascript">			
		SBGrid.DEF.DOMAIN = "../../";
	<script>
	
	<script type="text/javascript">
        var datagrid1, firstRowHeight;
        var objJSONdata = new Object();
        objJSONdata.objSBGridInitInfo = {
							strParentId: "",
							strId: "datagrid1",
							strCaption: "a^b^c^d^e^f^g^h",
							strDataHeight: "29",
							strColWidth: "12.5%,12.5%,12.5%,12.5%,12.5%,12.5%,12.5%,12.5%",
							strJsonRef: "grid_data.merge_normal",
							strStyle: "width:100%; height:380px;",
							strBackColorAlternate: "#f7f7f7",
							strSelectMode: "free"
        };
        objJSONdata.arSBGridColumnInitInfo = [
							{ "id": "col1", "type": "output", "ref": "a", "style": "text-align:center" },
							{ "id": "col2", "type": "output", "ref": "b", "style": "text-align:center" },
							{ "id": "col3", "type": "output", "ref": "c", "style": "text-align:center" },
							{ "id": "col4", "type": "output", "ref": "d", "style": "text-align:center" },
							{ "id": "col5", "type": "output", "ref": "e", "style": "text-align:center" },
							{ "id": "col6", "type": "output", "ref": "f", "style": "text-align:center" },
							{ "id": "col7", "type": "output", "ref": "g", "style": "text-align:center" },
							{ "id": "col8", "type": "output", "ref": "h", "style": "text-align:center" }
        ];

        $(document).ready(function () {
             __createElements("sbGridArea", "free");
        });

        function __createElements(strSBGridParentId, strselectmode) {
            if (SBGrid.getGrid('datagrid1') != null) {
                datagrid1.destroy();
                datagrid1 = null;
            }
            objJSONdata.objSBGridInitInfo.strParentId = strSBGridParentId;
            objJSONdata.objSBGridInitInfo.strSelectMode = strselectmode;
            var strMesage = "";
          
            if (objJSONdata.objSBGridInitInfo.strSelectMode == 'byrow') {
                strMesage = "행 단위로 선택을 합니다. ctrl 키를 이용하여 다중행을 선택할 수 없습니다.";
            }
            else if (objJSONdata.objSBGridInitInfo.strSelectMode == 'bycol') {
                strMesage = "열 단위로 선택을 합니다.";
            }
            else if (objJSONdata.objSBGridInitInfo.strSelectMode == 'listbox') {
                strMesage = "행 단위로 선택을 합니다. ctrl 키를 이용하여 다중행을 선택할 수 있습니다.";
            }
            else if (objJSONdata.objSBGridInitInfo.strSelectMode == 'free') {
                strMesage = "셀 단위로 자유롭게 선택하도록 합니다.";
            }
            datagrid1 = SBGrid.DEF.createSBGrid(objJSONdata);
          
            

            if (strMesage.length > 0) {
                alert(strMesage);
            }
        };

	</script>
</head> 
<body onload="createElements()" class="sbgrid_body" >
    <div id="contents">
        <div class="content_group">
            <div id="sbGridArea"></div>
        </div>
    </div>		
</body>
</html>