맨위로가기
 

SBUx

닫기

SBGrid

SBGrid 컴포넌트는 웹 그리드 컴포넌트 입니다.

기본 사항

기본 문법 필수 속성 비고

<sbux-sbgrid id="xxx" name="xxx" uitype="xxx" >

 
필수 속성 id, name, uitype  
uitype 속성 값 2.5  
예시) SBGrid 2.5 컴포넌트


<script language="javascript">

       var SBUxConfig = {

               Path : "./../sbux",

               SBGrid : {

                       Version2_5 : true

               }

       };                

</script>

<script src="./../sbux/SBUx.js" type="text/javascript"></script>

<script>

        var datagridNew;

        var grid_data = [];

</script>



<sbux-sbgrid id="datagridNew" name="datagridNew"  uitype="2.5"

        jsonref="grid_data"

        style="width:100%; height:450px;font-family:Verdana, arial;font-size: 9pt;"

        explorerbar = "sortshowmove"

        backcoloralternate = "#EFE0ED"

        rowheader = "seq"

        frozencols = "3">

       <columns>


        <column caption="기간|부서코드" width="70px" type="output"  ref="dept" style="text-align:center;" ></column>

        <column caption="기간|1주"        width="40px" type="output"  ref="name" style="text-align:center;" ></column>

           

       </columns>            

       <events>

               <event name="click" func="eventProcess" ></event>

               <event name="mousedown" func="eventProcess" ></event>

               <event name="mouseup" func="eventProcess" ></event>

               <event name="keydown" func="eventProcess" ></event>

       </events>

</sbux-sbgrid>


<script>

       function eventProcess(event){

               var objSBGrid = event.data.target;

               switch(event.type){

                       case 'mousedown':console.log('사용자 등록 mousedown 이벤트');break;

                       case 'mouseup':console.log('사용자 등록 mouseup 이벤트');break;

                       case 'click':console.log('사용자 등록 onlclick 이벤트');break;

                       case 'keydown':console.log('사용자 등록 keydown 이벤트');break;

               }

               objSBGrid = null;

       }

</script>