JQGrid 활용 분석(컬럼 편집, 행 추가, 행 삭제)

코드 복사 코드는 다음과 같습니다. $(document).ready(function() { initPlsfList(); }); //初始化grid列表 function initPlsfList(){ //缓存表列数组,key 为页面元素的name ，value 对应数据库中的字段 var cellArray = new Array(); cellArray["zoneID"] ="ZONE_ID"; cellArray["factorPG"] ="FACTOR_PG"; cellArray["factorQG"] ="FACTOR_QG"; cellArray["factorPL"] ="FACTOR_PL"; cellArray["factorQL"] ="FACTOR_QL"; cellArray["valid"] ="VALID";

}, onSortCol:function(index,iCol,sortorder){ return false ; }, ondblClickRow: function (rowid,iRow,iCol,e) { /*var $plsfList = $("#plsfList"); if (isRowNeedSave($plsfList)){ showMessage("请先保存"); }else{ $("#operate").val("update"); newrowid = rowid ; $plsfList.setGridParam({cellEdit:false}); $plsfList.jqGrid('editRow', rowid, true); //确定按钮可用 $("#confirm_btn").attr("disabled",false);

}*/ }, beforeSubmitCell:function(rowid, cellname, value, iRow, iCol){ //列提交前的拦截方法 var $plsfList = $("#plsfList") ; var $editUrl = ' ' ; //设置列提交的url。updateCellName：要编辑的列名 ；updateCellValue ：是编辑的值 $editUrl = addParamToUrl($editUrl,'updateCellName',iCol == 3 ? cellArray['zoneID'] :cellArray[cellname]); $editUrl = addParamToUrl($editUrl,'updateCellValue',iCol == 3 ? $("#zone_id").val():value); //给jqgrid 从新设置cellurl 值 $plsfList.setGridParam({cellurl:$editUrl}); return false ; }, afterEditCell:function(rowid, cellname, value, iRow, iCol){ //动态修改lie时，当列 变为可修改状态时，给列add一个button，且列中元素不可编辑，点击button 弹出一个模态窗口，可以选择元素 ，赋值给grid当前编辑列中单行表单域中. $("#"+rowid+" input[type='checkbox']").attr("checked",value == " " ? true:false); if(iCol==3){ $("#irowNum").val(rowid); var $data = $("#"+rowid +">td"); //获取这个行里所有的td元素，即：获取所有子元素 $zoneInput = $data.find("input").eq("1") ; $zoneInput.css("width","100px"); $zoneInput.attr("disabled",true); $zoneInput.after(" "); } }

});

//그리드에 새 행 추가 var newrowid; function addRow() { $("#operate").val(""); var selectedId = $("#plsfList").jqGrid("getGridParam", "selrow") var ids = jQuery("#plsfList").jqGrid('getDataIDs'); //가져오기 현재 최대 행 번호(데이터 번호) var rowid = Math.max.apply(Math,ids) //새로 추가된 행의 행 번호(데이터 번호)를 가져옵니다. newrowid = rowid 1; var dataRow = { id: "", 유효한:"", zoneID:'', FactorPG:'', FactorQG:'', FactorPL: '', FactorQL:'', caseID:'' }

//새로 추가된 행을 첫 번째 열에 삽입 $(" #plsfList" ).jqGrid("addRowData", newrowid, dataRow, "first"); //그리드 셀을 편집할 수 없도록 설정 $("#plsfList").setGridParam({cellEdit:false }); //그리드 셀을 편집 가능하도록 설정 $('#plsfList').jqGrid('editRow', newrowid, false); //확인 버튼 사용 가능 $( "#confirm_btn"). attr("disabled",false); //추가된 열에 선택 버튼 추가 var $zoneInput = $("#" newrowid "_zoneName"); $ zoneInput.attr("disabled" ,true).css("width",100); $zoneInput.after(" ");

}

function insertPlsf(){ var $plsfList = $("#plsfList") ; var $operate = $("#operate").val(); // 그리드 셀을 편집 가능으로 설정 $plsfList.setGridParam({cellEdit:true}); //그리드 행을 편집 불가능으로 설정 //$plsfList.jqGrid('editRow', newrowid, false) ; //접합 요청 URL var url = ' ' "/lfc/powerlsfactor/save" ; var $params = $plsfList.find("input[ id ^=" newrowid "]"); var $check_val = $params.eq(0).is(':checked') ? 1:0; url = addParamToUrl(url,'valid', $ check_val); url = addParamToUrl(url,'zoneID',$("#zone_id").val()); url = addParamToUrl(url,'factorPG',$params.eq(2) . val()); url = addParamToUrl(url,'factorQG',$params.eq(3).val()); url = addParamToUrl(url,'factorPL',$params.eq( 4 ).val()); url = addParamToUrl(url,'factorQL',$params.eq(5).val());

var $caseID = $("#caseID" ) .val(); url = addParamToUrl(url,'caseID',$caseID);

$.ajax({url:url,type:"post",timeout:5000, 성공:함수(데이터){ showMessage(data); reloadGrid(); } }); //새로 추가된 줄 번호는 처음에는 비어 있습니다 newrowid = '' ; //확인 버튼을 사용할 수 없습니다 $("#confirm_btn"). attr( "비활성화됨",true); }

//영역 열 출력 내용 포맷 function formatZone(cellvalue, options, rowObject){ if(cellvalue == 0){ return 0; }else if( 셀 값 == 1){ 반환 1; }else if(셀 값 == 2){ 반환 2; }else{ 반환 3; } }

function isRowNeedSave($jqgrid){ var $editTr = $jqgrid.find("tr[editable=1]") ; var flag = false ; if( $editTr && $editTr.length > 0){ 플래그 = true ; } 반환 플래그 ; }

function cancel(){ reloadGrid(); //확인 버튼을 사용할 수 없습니다 $("#confirm_btn").attr("disabled",true); //그리드 셀을 편집 가능하게 설정 $("#plsfList").setGridParam({cellEdit:true}); //그리드 셀을 편집 가능하게 설정 $('#plsfList') .jqGrid('editRow', newrowid, true); }

function fnCallDialogForEidt(){ //현재 줄 번호(데이터 번호) 가져오기 var returnValue = ""; returnValue = window.showModalDialog(" ",window,""); if(returnValue==""||returnValue==null) return; var $plsfList = $("#plsfList"); var $params = $plsfList.find("input[id$='zoneName']"); var 이름 = returnValue.split(","); $params.eq(0).val(names[1]); $("#zone_id").val(names[0]); }

JQGrid 활용 분석(컬럼 편집, 행 추가, 행 삭제)_jquery