/* 특정 컬럼에 퍼센테이지 바 넣기 */
/* percentage bar */
| <html> <head> <style type="text/css"> <!-- #base1 { background-color: #D42121; height: 12px; position:relative; top: 0px; } //--> </style> </head> <link rel="stylesheet" type="text/css" media="screen" href="./jqueryUi/jquery-ui.css" /> <link rel="stylesheet" type="text/css" media="screen" href="./jqGrid/css/ui.jqgrid.css" /> <style type="text/css"> </style> <script src="./jqGrid/js/jquery-3.2.1.min.js"></script> <script src="./jqueryUi/jquery-ui.js"></script> <script src="./jqGrid/js/jquery.jqGrid.min.js"></script> <script language='javascript' > var value1 = ''; $(function(){ var gridData = [ {seq:"1",date1:"2017/09/01",name1:"Homer",name2:"note",name3:"100",hitnum:"100"}, {seq:"2",date1:"2017/09/01",name1:"Homer",name2:"note",name3:"70",hitnum:"100"}, {seq:"3",date1:"2017/09/01",name1:"Homer",name2:"note",name3:"30",hitnum:"100"}, {seq:"4",date1:"2017/10/02",name1:"Marge",name2:"note2",name3:"80",hitnum:"350"} ]; $("#list").jqGrid({ datatype: "local", height: 300, width:500, sortable: false , shrinkToFit : false, colNames:['seq','name1', 'name2', 'name3', 'date','hit'], colModel:[ {name:'seq' , frozen:true , width:100 }, {name:'name1' , frozen:true , width:100 }, {name:'name2' , width:100 }, {name:'name3' , width:100 , formatter:abc }, {name:'date1' , width:100 }, {name:'hitnum' , width:100 } ], caption: " title aa ", gridComplete: function() { $('#list').on("selectstart", function(event){ return false; }); $('#list').on("dragstart", function(event){ return false; }); } }); for(var i=0;i<=gridData.length;i++){ $("#list").jqGrid('addRowData',i+1,gridData[i]); } $("#list").jqGrid( 'setFrozenColumns' ); }) function abc( cellvalue, options, rowObject ){ return " <div id='base1' style=' width:"+cellvalue+"% ' > </div> "; } </script> <body> <table id="list"></table> </body> </html> |
'[.js][software]' 카테고리의 다른 글
| [realGrid] 기타 (0) | 2018.09.14 |
|---|---|
| [extJs] 헤더(컬럼) 동적으로 추가하기 (0) | 2017.09.14 |
| [jqGrid] jqGrid 틀고정 Fixed frame (0) | 2017.09.11 |
| [jqGrid] 특정 셀 마우스다운하고 다른 셀에 마우스 업하면 값 이동 (0) | 2017.09.11 |
| [jqGrid] simple Grid (local) (0) | 2017.09.08 |
