SBGrid는 필터링 기능을 제공합니다. 지원하는 필터링은 > , >= , < , <=, LIKE 입니다.


요약

사용자가 그리드 헤더 영역을 클릭하면 열이 오름/내림차순으로 정렬됩니다.

입력값

String : 유형



예) "strExplorerbar" : "sort"

상세설명

strExplorerbar 를 속성으로 각각의 유형별로 아래와 같은 동작을 합니다.

move : 열의 타이틀 영역을 드래그하여 위치조절

sort : 열의 타이틀 영역을 클릭하여 각 열을 정렬

sortmove : 열의 타이틀 영역 정렬및 드래그하여 위치조절

sortshow : 열의 타이틀 영역을 클릭하여 정렬 및 타이틀 영역에 작은 화살표료 정렬방식 표시

sortshowmove : 정렬,위치조절, 작은화살표로 표시

<!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_100.js"></script>
		
	<script type="text/javascript">			
		SBGrid.DEF.DOMAIN = "../../";
	<script>
	
	<script type="text/javascript">
        
        var datagrid1;
        $(document).ready(function () {
            __createElements();
        });
        function __createElements() {
            var GridInitInfo = {
						"strParentId": "sbGridArea",
						"strId": "datagrid1",
						"strCaption": "name^나이^성별^직급^전화번호^메일주소^비고(입력란)",
						"strColWidth": "100, 80, 80, 100, 130, 150, 200",
						"strJsonRef": "eval1.grid",
						"strDataHeight": "29",
						"strStyle": "width:100%; height:480px; ",
						"strExplorerUI": "filtering",
						"strBackColorAlternate": "#f7f7f7",
						"strExtendLastCol": "noscroll"
            };
            var SBGridColumnInitInfo = [
						{ "id": "col1", "type": "output", "ref": "name", "style": "text-align:center;" },
						{ "id": "col2", "type": "output", "ref": "age", "style": "text-align:right;padding-right:5px" },
						{ "id": "col3", "type": "combo", "ref": "sex", "strJsonNodeSet": "eval1.combo_sex", "strLabelRef": "label", "strValueRef": "value", "style": "text-align:center;" },
						{ "id": "col4", "type": "combo", "ref": "class", "strJsonNodeSet": "eval1.combo_class", "strLabelRef": "label", "strValueRef": "value", "style": "text-align:center;" },
						{ "id": "col5", "type": "output", "ref": "phone", "style": "text-align:center;" },
						{ "id": "col6", "type": "output", "ref": "email", "style": "text-align:left;padding-left:5px" },
						{ "id": "col7", "type": "input", "ref": "add_info", "style": "text-align:left;padding-left:5px" }
            ];
            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);
        };
			
	</script>
</head>
<body onload="createElements()" class="sbgrid_body" >
		
	<div id="button_group">
		<input type="button" class="sbgrid_demo_button1"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('class'), '5', false]]);" value="필터링: 직급-대리" />
		<input type="button" class="sbgrid_demo_button2"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('class'), '5', true]]);" value="필터링 : 직급-대리 제외" />
		<input type="button" class="sbgrid_demo_button3"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('age'), '29', false]]);" value="필터링 : 나이-29" />
		<input type="button" class="sbgrid_demo_button4"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('age'), '29', true]]);" value="필터링 : 나이-29 제외" />
		<input type="button" class="sbgrid_demo_button5"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('name'), '안과장', false]]);" value="필터링 : 이름-안과장" />
		<input type="button" class="sbgrid_demo_button6"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('name'), '안과장', true]]);" value="필터링 : 이름-안과장 제외" />
		<input type="button" class="sbgrid_demo_button7"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('sex'), 'male', false]]);" value="필터링 : 성별-남자" />
		<input type="button" class="sbgrid_demo_button8"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('sex'), 'male', true]]);" value="필터링 : 성별-남자 제외" />
		<input type="button" class="sbgrid_demo_button9"  id="btnEmptyMessage"  onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('class'), '5', false], [datagrid1.getColRef('age'), '29', false]], ['AND'], false);" value="필터링 : 직급-대리 AND 나이 29" />
		<input type="button" class="sbgrid_demo_button10"  id="btnEmptyMessage" onclick = "datagrid1.setRowFiltering([[datagrid1.getColRef('name'), '안과장', false], [datagrid1.getColRef('sex'), 'male', false]], ['OR'], false);" value="필터링 : 이름-안과장 OR 성별 남자" />
	</div>
        <div class="content_group">
            <div id="sbGridArea"></div>
        </div>
  		
</body>
</html>