jqGrid auto width

jqGrid도 colModel에서 width를 %로 줄 수 있다.

​

shrinkToFit 를 true로 바꾸고 width도 %로 변경하면 자동으로 width가 바뀐다.

 

$grid.jqGrid({
	        url : gridUrl,
			datatype: "json",
			mtype : "GET",
	        scroll: 1,
            rownumbers: false,
	        rowNum: 30,
	        autowidth: true,
			shrinkToFit: true,  --> 중요
            height: "auto",
            postData : queryValue,
	        jsonReader : {
	        	root : "resultList",
	        	page : "currentPage",
	        	total : "totalPage",
	        	records : "totalCount"
	        },
	        colModel: [
				{ hidedlg: true, name: 'resourceType', hidden: true},
				{ hidedlg: true, name: 'storyId', hidden: true},
				{ hidedlg: false, label:'구분', name : 'icon', index: 'icon', width:'20%'},
				{ hidedlg: false, label:'제목', name: 'title', index: 'title', align: 'left', width: '80%'}
			],

setTimeout(function(){
		window.newsLayout = $(".layoutWrapper").layout({
			applyDemoStyles : true,
			maskIframesOnResize: true,
			onload_end : function(){
				if(listType == 'sediaDBResource') {
					sediaInitGrid();
				}else if(listType == "yonhapResource"){
					yonhapInitGrid();
				} else {
					<%--CMS 상세검색--%>
					initGrid();
				}
			},
			south : {
				size: 300,
				minSize: 100,
				maxSize: 450,
				resizerDblClickToggle:false,
				autoResize:false,
				closable: false,
				onresize_end :
					$.debounce(150, function(){
						console.log('dd');
						$grid.setGridHeight($("#newsGridWrapper").height() - 20);
						$grid.setGridWidth($("#newsGridWrapper").width() + 20);//얘 꼭필요
						//$grid.setGridWidth($("#newsGridWrapper").width() + 20);
						$("#newsPreview").contents().find("#right_preview").height($(".ui-layout-south").height());
					}),
			}
		});

	},400);

$grid.setGridWidth($("#newsGridWrapper").width() + 20); 가 중요