Wanna be Brilliant Full-Stack Developer
JQGRID #4 본문
function stock_out_jqGrid_main() {
$("#stock_out_grid").jqGrid({
datatype: "local",
mtype: 'POST',
colNames : ['출고번호','출고일자','품번','품명','업체코드','업체','수량','등록자','등록일시'],
colModel : [
{name: 'out_no', index: 'out_no',width:100, fixed: true, sortable: false, key: true, hidden:true},
{name: 'work_date', index: 'work_date', width:100, fixed: true, sortable: false},
{name: 'part_code', index: 'part_code', width:100, fixed: true, sortable: false},
{name: 'part_name', index: 'part_name', width:200, fixed: true, sortable: false},
{name: 'supp_code', index: 'supp_code', width:100, fixed: true, sortable: false,hidden:true},
{name: 'supp_name', index: 'supp_name', width:100, fixed: true, sortable: false},
{name: 'out_qty', index: 'out_qty', width:100, fixed: true, sortable: false},
{name: 'user_code', index: 'user_code', width:100, fixed: true, sortable: false},
{name: 'create_date', index: 'create_date', width:160, fixed: true, sortable: false}
],
caption: "자재출고 | MES",
sortable: true,
autowidth: true,
height: 570,
pager: '#stock_out_grid_pager',
rowNum: 100,
rowList: [100, 200, 300, 1000],
shrinkToFit: false,
viewrecords: true,
multiselect: true,
beforeSelectRow: function (rowid, e) {
var $myGrid = $(this),
i = $.jgrid.getCellIndex($(e.target).closest('td')[0]),
cm = $myGrid.jqGrid('getGridParam', 'colModel');
return (cm[i].name === 'cb');
},
loadComplete:function(){
grid_horizon_scroll("#stock_out_grid");
},
ondblClickRow: function update_supp(rowid) {
stock_out_modaload();
keyword ='U';
var key = $("#stock_out_grid").getGridParam('selarrrow');
var out_no = $("#stock_out_grid").jqGrid('getRowData', rowid).out_no;
var work_date = $("#stock_out_grid").jqGrid('getRowData', rowid).work_date;
var part_code = $("#stock_out_grid").jqGrid('getRowData', rowid).part_code;
var part_name = $("#stock_out_grid").jqGrid('getRowData', rowid).part_name;
var supp_code = $("#stock_out_grid").jqGrid('getRowData', rowid).supp_code;
var supp_name = $("#stock_out_grid").jqGrid('getRowData', rowid).supp_name;
var out_qty = $("#stock_out_grid").jqGrid('getRowData', rowid).out_qty;
var user_code = $("#stock_out_grid").jqGrid('getRowData', rowid).user_code;
var create_date = $("#stock_out_grid").jqGrid('getRowData', rowid).create_date;
var gu5 = String.fromCharCode(5);
var obj_data = {}
var list=[];
obj_data.stock_keywrod = stock_keyword;
obj_data.keyword = keyword;
obj_data.list = key.join(gu5);
obj_data.out_no = rowid;
console.log(obj_data);
$("#out_no").val(out_no);
$("#work_date").val(work_date);
$("#box_part_code").val(part_code).trigger('change');
$("#part_name").val(part_name);
$("#model_name").val(model_name);
$("#supp_code").val(supp_code);
$("#supp_name").val(supp_name);
$("#out_qty").val(out_qty);
$("#stock_out_modal").dialog("open");
},
});
$("#stock_out_grid").jqGrid('navGrid', '#supp_grid_pager', {
add: false,
edit: false,
del: false,
search: false,
refresh: false
});
$("#stock_out_grid").jqGrid('navButtonAdd', '#supp_grid_pager', {
caption: "열 조정",
title: "열 조정",
buttonicon: "fa fa-list-alt bigger-110 blue column_chooser_icon",
onClickButton: function() {
$.extend(true, $.ui.multiselect, {
defaults: {searchable :false},
locale: {addAll: '모두 보임', removeAll: '모두 숨김', itemsCount: '사용할 열의 수'},
});
$("#stock_out_grid").jqGrid('columnChooser', {
dialog_opts: {modal: true, resizable: false},
});
},
position : 'last'
});
}
- `datatype:
"local"`: jqGrid의 데이터 타입을 로컬로 설정합니다. 이는 그리드에 표시되는 데이터가 로컬 데이터임을 의미합니다.
- `mtype: 'POST'`: jqGrid의 HTTP 요청 방식을 POST로 설정합니다.
- `colNames`와 `colModel`: 그리드의 컬럼 이름과 모델을 설정합니다. 각 컬럼은 출고번호, 출고일자, 품번, 품명, 업체코드, 업체, 수량, 등록자, 등록일시 등을 나타냅니다.
- `caption: "자재출고 | MES"`: 그리드의 제목(caption)을 설정합니다.
- `sortable: true`: 그리드의 컬럼을 정렬할 수 있도록 설정합니다.
- `autowidth: true`: 그리드의 너비를 자동으로 조정하도록 설정합니다.
- `height: 570`: 그리드의 높이를 570px로 설정합니다.
- `pager: '#stock_out_grid_pager'`: 그리드의 페이저(pager)로 `#stock_out_grid_pager`를 사용합니다.
- `rowNum: 100`: 한 페이지에 표시할 행 수를 100으로 설정합니다.
- `rowList: [100, 200, 300, 1000]`: 행 수 선택 옵션을 100, 200, 300, 1000으로 설정합니다.
- `shrinkToFit: false`: 그리드의 너비 조정을 비활성화합니다.
- `viewrecords: true`: 그리드에 레코드 수를 표시합니다.
- `multiselect: true`: 다중 선택을 가능하도록 설정합니다.
- `beforeSelectRow`: 행 선택 전에 호출되는 함수로, 체크박스를 클릭한 경우에만 행 선택이 가능하도록 설정합니다.
- `loadComplete`: 그리드의 데이터 로딩이 완료된 후 호출되는 함수로, `grid_horizon_scroll()` 함수를 호출하여 그리드의 가로 스크롤을 설정합니다.
- `ondblClickRow`: 행을 더블 클릭한 경우 호출되는 함수입니다. 선택된 행의 데이터를 가져와 모달 창에 표시하고, 모달 창을 엽니다.
- `navGrid`: 그리드의 네비게이션 설정을 지정합니다. 추가, 편집, 삭제, 검색, 새로고침 기능을 비활성화합니다.
- `navButtonAdd`: 그리드에 열 조정 버튼을 추가합니다. 클릭 시 `columnChooser`를 호출하여 열을 선택할 수 있는 대화상자를 표시합니다.
'Some Memos > JQGRID' 카테고리의 다른 글
JQGRID #5 getGridParam과 setGridParam 차이 (0) | 2023.06.02 |
---|---|
JQGRID #3 (0) | 2023.05.24 |
JQGRID 메모 (0) | 2023.03.28 |