第一次使用JqGrid 想把代码里的某些列隐藏，但是一直没成功：
<script type="text/javascript">
$(document).ready(function () {
$("#companyInstructionList").jqGrid({
url: '@Url.Action("GetCompanyInstructionList", "Admin", null)',
datatype: 'json',
myType: 'GET',
ajaxGridOptions: { cache: false },
colNames: ['Company Name', 'Work Instruction Source', 'IKS Display Option', 'Template Option', 'KM Source', 'SMKM UserName', 'SMKM Password', 'EnableIKSServiceCIMapping', 'EnableIKSServiceCIMappingWarning'],
colModel: [
{
name: 'CompanyName', index: 'CompanyName', label: 'CompanyName', width: 100, align: 'left', search: true, sortable: false, editable: true , editoptions: {
dataInit: function (element) {
element.disabled = true;
}
}
},
{ name: 'WorkInstructionSource', index: 'WorkInstructionSource', label: 'WorkInstructionSource', width: 150, align: 'left', search: false, sortable: false, editable: true, edittype: 'select', stype: 'select', editoptions: { value: "IKS:IKS;SM:SM" } },
{ name: 'KMDisplayOption', index: 'KMDisplayOption', label: 'KMDisplayOption', width: 100, align: 'left', search: false, sortable: false, editable: true, edittype: 'select', stype: 'select', editoptions: { value: "Directly_Open:Directly_Open;Render:Render" } },
{ name: 'TemplateOption', index: 'TemplateOption', label: 'TemplateOption', width: 100, align: 'left', search: false, sortable: false, editable: true, edittype: 'select', stype: 'select', editoptions: { value: "Regular:Regular;PG:PG" } },
{ name: 'KMSource', index: 'KMSource', label: 'KM Source', width: 90, align: 'left', search: false, sortable: false, editable: true, edittype: 'select', stype: 'select', editoptions: { value: "IKS:IKS;SM:SM" } },
{ name: 'SMKMUserName', index: 'SMKMUserName', label: 'SMKM UserName', width: 120, align: 'left', search: false, sortable: false, editable: true, edittype: 'text' },
{ name: 'SMKMPassword', index: 'SMKMPassword', label: 'SMKM Password', width: 120, align: 'left', search: false, sortable: false, editable: true, edittype: 'text' },
{ name: 'EnableIKSServiceCIMapping', index: 'EnableIKSServiceCIMapping', label: 'EnableIKSServiceCIMapping', width: 150, align: 'left', search: false, sortable: false, editable: true, edittype: "checkbox", editoptions: { value: "Yes:No" } },
{ name: 'EnableIKSServiceCIMappingWarning', index: 'EnableIKSServiceCIMappingWarning', label: 'EnableIKSServiceCIMappingWarning', width: 150, align: 'left', search: false, sortable: false, editable: true, edittype: "checkbox", editoptions: { value: "Yes:No" } }
],
jsonReader: { repeatitems: false },
viewrecords: true,
rowNum: 30,
rowList: [30, 40, 50],
pager: '#companyInstructionListPager',
loadonce: false,
shrinkToFit: false,
height: 'auto',
width:800,
hidegrid: false,
ignoreCase: true,
caption: 'Configure Company',
ondblClickRow: function (rowid, iRow, iCol, e) {
showEditForm(rowid);
}
});
$("#companyInstructionList").jqGrid('navGrid', '#companyInstructionListPager', { edit: false, add: false, del: false, search: false }, {});
//auto height and set max-height
$("#companyInstructionList").parents('div.ui-jqgrid-bdiv').css("max-height", "300px");
});
$("#editBtn").button().click(function () {
var gr = jQuery("#companyInstructionList").jqGrid('getGridParam', 'selrow');
if (gr != null) showEditForm(gr);
else alert("Please select a record!");
});
function showEditForm(gr) {
var rowData = $("#companyInstructionList").getRowData(gr);
var companyName = rowData['CompanyName'];
var workInstructionSource = rowData['WorkInstructionSource'];
var KMDisplayOption = rowData['KMDisplayOption'];
var TemplateOption = rowData['TemplateOption'];
var KMSource = rowData['KM Source'];
var SMKMUserName = rowData['SMKM UserName'];
var SMKMPassword = rowData['SMKM Password'];
var EnableIKSServiceCIMapping = rowData['EnableIKSServiceCIMapping'];
var EnableIKSServiceCIMappingWarning = rowData['EnableIKSServiceCIMappingWarning'];
@*jQuery("#companyInstructionList").jqGrid('editGridRow', gr, {
height: 270, width: 470, resize: false, reloadAfterSubmit: true, closeAfterEdit: true, closeAfterAdd: true, url: '@Url.Action("ConfigureCompanyInstruction", "Admin")' + '?companyName=' + companyName + '&workInstructionSource=' + workInstructionSource + '&kmDisplayOption=' + KMDisplayOption + '&templateOption=' + TemplateOption
});*@
jQuery("#companyInstructionList").jqGrid('navGrid', 'hideCol', SMKMUserName);
jQuery("#companyInstructionList").jqGrid('editGridRow', gr, {
height: 350, width: 470, resize: false, reloadAfterSubmit: true, closeAfterEdit: true, closeAfterAdd: true, url: '@Url.Action("ConfigureCompanyInstruction", "Admin")',
extraparam: {
'companyName': companyName, 'workInstructionSource': workInstructionSource,
'kmDisplayOption': KMDisplayOption, 'templateOption': TemplateOption,
'kmSource': KMSource, 'smKMUserName': SMKMUserName, 'smKMPassword': SMKMPassword,
'enableIKSServiceCIMapping': EnableIKSServiceCIMapping, 'enableIKSServiceCIMappingWarning': EnableIKSServiceCIMappingWarning
}
});
}
function labelEditFunc(value, opt) {
return "<span>" + value + "</span>";
}
function getLabelValue(e, action, textvalue) {
if (action == 'get') return e[0].innerHTML;
else if (action == 'set') $(e).html(textvalue);
}
</script>
比如KMSource如果为1 就隐藏SMKMUserName列
你是现在编辑的时候隐藏某些列吧。。参考：jqGrid限制某些列只有在特定条件下才能编辑
colModel里对某列设置这两个bool属性
hidedlg 是否显示或者隐藏此列
hidden 在初始化表格时是否要隐藏此列