我已经在asp.net web表单中使用jqgrid 4.7创建了一个报表 在asp.net 4.0中。
它在本地视觉工作室中工作正常但在吊装IIS后无法正常工作 页面显示空。
我在下面发布了我的脚本， 请给我一些解决方案。
-------这里我的代码----需要提前完成。
jQuery(document).ready(function () {
jQuery.extend(jQuery.jgrid.edit, {
closeAfterEdit: true,
closeAfterAdd: true,
ajaxEditOptions: { contentType: "application/json" },
serializeEditData: function (postData) {
var postdata = { 'data': postData };
return JSON.stringify(postdata);;
}
});
jQuery.extend(jQuery.jgrid.del, {
ajaxDelOptions: { contentType: "application/json" },
onclickSubmit: function (eparams) {
var retarr = {};
var sr = jQuery("#datagrid").getGridParam('selrow');
rowdata = jQuery("#datagrid").getRowData(sr);
retarr = { PID: rowdata.PID };
return retarr;
},
serializeDelData: function (data) {
var postData = { 'data': data };
return JSON.stringify(postData);
}
});
filters = {
"groupOp": "AND", "rules": [{ "field": "id", "op": "gt", "data": "1" },
{ "field": "name", "op": "bw", "data": "Client" }]
}
$("#datagrid").jqGrid({
url: 'MIS.aspx/GetMIS',
datatype: 'json',
mtype: 'POST',
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
serializeGridData: function (postData) {
if (postData.filters === undefined) postData.filters = null;
return JSON.stringify(postData);
},
jsonReader: { root: "d.rows", page: "d.page", total: "d.total", records: "d.records", cell: "cell", id: "0", /* index of the column with the PK in it userdata: "userdata",*/ repeatitems: false },
colNames:['Customer Name', 'Handling Branch', 'Handler Name', 'Transaction Origin', 'Last Action', 'Last Action Date', 'Reason', 'EnquiryNo', 'QuoteRefNo',
'SaleorderNo', 'Enquiry Created By', 'Enquiry Created Date', 'Assigned Date', 'Enquiry Mode', 'Enquiry Reference', 'Quote Submitted For Approval',
'Manager', 'Quote Approved Date', 'Quote Sent Date', 'Quote Value', 'PurchaseOrder Value ', 'PurchaseOrder No', 'PurchaseOrder Date', 'Reference', 'PO Type', 'SalesOpportunity',
],
colModel: [
{
name: 'CustomerName', index: 'CustomerName',
searchoptions: {sopt: ['eq', 'cn']}, searchrules: { "required": true }, width: 150, sortable: true, sorttype: 'text'
},
{ name: 'HandlerBranch', index: 'HandlerBranch', searchoptions: { sopt: ['eq', 'cn'] }, width: 100, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'HandlerName', index: 'HandlerName', searchoptions: { sopt: ['eq', 'cn'] }, width: 100, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'TransactionOrigin', index: 'TransactionOrigin', searchoptions: { sopt: ['eq', 'cn'] }, width: 100, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'LastAction', index: 'LastAction',width: 150, stype: "select",
searchoptions: {
value: getStatus(), sopt: ['cn']
}, sorttype: 'text'
},
{ name: 'LastActionDate', index: 'LastActionDate', width: 100,sorttype:'date',
searchoptions: {
sopt: ['eq','ge', 'le'],
dataInit: function (element) {
$(element).datepicker({
id: 'ActionDate_datePicker',
dateFormat: 'dd-mm-yy',
showOn: 'focus'
});
}
},
sortable: true, width: 100, searchrules: { "required": true }
},
{ name: 'Reason', index: 'Reason', searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }, width: 100, sorttype: 'text' },
{ name: 'EnquiryNo', index: 'EnquiryNo', width: 100, searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'QuoteRefNo', index: 'QuoteRefNo', width: 100, searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'SaleOrderNo', index: 'SaleOrderNo', width: 100, searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }, sorttype: 'text' },
{ name: 'EnquiryCreatedBy', index: 'EnquiryCreatedBy', width: 100, searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }, sorttype : 'text' },
{ name: 'EnquiryCreatedDate', width: 100, index: 'EnquiryCreatedDate',
searchoptions: {
sopt: ['eq','ge', 'le'],sorttype: 'date',
dataInit: function (element) {
$(element).datepicker({
id: 'ActionDate_datePicker',
dateFormat: 'dd-mm-yy',
//minDate: new Date(2010, 0, 1),
// maxDate: new Date(2020, 0, 1),
showOn: 'focus'
});
}
}, searchrules: { "required": true }
},
{ name: 'AssignedDate', index: 'AssignedDate', width: 100,
searchoptions: {
sopt: ['eq', 'ge', 'le'], sorttype: 'date',
dataInit: function (element) {
$(element).datepicker({
id: 'AssignedDate_datePicker',
dateFormat: 'dd-mm-yy',
//minDate: new Date(2010, 0, 1),
//maxDate: new Date(2020, 0, 1),
showOn: 'focus'
});
}
}, width: 100, searchrules: { "required": true }
},
{ name: 'EnquiryMode', index: 'EnquiryMode', width: 100, sorttype: 'text', searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true } },
{ name: 'EnquiryReference', index: 'EnquiryReference', sorttype: 'text', width: 100, searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required" : true } },
{ name: 'QuotesubmitedForApproval', index: 'QuotesubmitedForApproval', width: 200, sorttype: 'date',
searchoptions: {
sopt: ['ge', 'le'],
dataInit: function (element) {
$(element).datepicker({
id: 'yetoappDate_datePicker',
dateFormat: 'dd-mm-yy',
showOn: 'focus'
});
}
}, searchrules: { "required": true }
},
{ name: 'Manager', index: 'Manager', width: 100, sorttype: 'text', searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true } },
{ name: 'QuoteApprovedDate', index: 'QuoteApprovedDate', width: 100, sorttype: 'date',
searchoptions: {
sopt: ['ge', 'le'],
dataInit: function (element) {
$(element).datepicker({
id: 'ApprovedDate_datePicker',
dateFormat: 'dd-mm-yy',
showOn: 'focus'
});
}
}, searchrules: { "required": true }
},
{ name: 'QuoteSentDate', index: 'QuoteSentDate', width: 100, sorttype: 'date',
searchoptions: { sopt: ['eq','ge', 'le'] ,
dataInit: function (element) {
$(element).datepicker({
id: 'QuotesentDate_datePicker',
dateFormat: 'dd-mm-yy',
//minDate: new Date(2010, 0, 1),
// maxDate: new Date(2020, 0, 1),
showOn: 'focus'
});
}
}, searchrules: { "required": true }
},
{ name: 'QuoteValue', index: 'QuoteValue', sorttype: 'date', width: 100, searchoptions: { sopt: ['eq', 'ge', 'le'] }, searchrules: {
"required": true,
"number": true
}
, sorttype: 'number'
},
{ name: 'PurchaseOrderValue', index: 'PurchaseOrderValue', searchoptions: { sopt: ['eq', 'ge', 'le'] }, width: 100,
searchrules: {
"required": true,
"number": true
}, sorttype: 'number'
},
{ name: 'PurchaseOrderNo', index: 'PurchaseOrderNo', sorttype: 'date', searchoptions: { sopt: ['eq', 'cn'] }, width: 100, searchrules: { "required": true } },
{ name: 'PurchaseOrderDate', index: 'PurchaseOrderDate', sorttype: 'date', width: 100,
searchoptions: {
sopt: ['eq', 'ge', 'le'],
dataInit: function (element) {
$(element).datepicker({
id: 'PODate_datePicker',
dateFormat: 'dd-mm-yy',
//minDate: new Date(2010, 0, 1),
//maxDate: new Date(2020, 0, 1),
showOn: 'focus'
});
}
}
,searchrules: { "required": true }
},
{ name: 'Reference', index: 'Reference', width: 100, sorttype: 'text', searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true } },
{ name: 'PuchaseOrdertype', index: 'PuchaseOrdertype', sorttype: 'text', searchoptions: { sopt: ['eq', 'cn'] }, searchrules: { "required": true }
},
{ name: 'SalesOpportunity', index: 'SalesOpportunity', sorttype: 'text', stype: "select", width: 150,
searchoptions: {
clearSearch: false,
value: "open:Open;Closed:Closed;Drop:Drop;Lost:Lost", sopt: ['eq'],
//buildSelect: createSelectList,
//attr: { multiple: 'multiple', size: 2 },
//dataInit: dataInitMultiselect,
//buildSelect: createSelectList
},
searchrules: { "required": true }
},
],
//footerrow: true,
//userDataOnFooter: true,
rowNum: 50,
rowList: [10, 20, 50, 100],
shrinkToFit: false,
//sortable: false,
autoencode: true,
sortname: 'LastActionDate',
sortorder: "Asc",
multiselect: false,
frozenColumns: false,
ReorderCoulmns : true,
ignoreCase: true,
pager: "#navGrid",
viewrecords: true,
gridview: false,
width: 1200,
height: 500,
//rownumbers: true, // show row numbers
rownumWidth: 25, // the width of the row numbers columns
//loadComplete: loadCompleteHandler1,
ondblClickRow: function (rowid) {
jQuery(this).jqGrid('viewGridRow', rowid);
},
//beforeRequest: function () //loads the jqgrids state from before save
//{
// modifySearchingFilter.call(this, ',');
//},
sortable: {
update: function (perm) {
if (perm) {
$("#datagrid").jqGrid("remapColumns", perm, true);
var colModels = $("#navGrid").getGridParam("colModel");
}
}
},
caption: 'MIS Report',
loadError: function (xhr, textStatus, errorThrown) {
var errorMsg = xhr.responseText;
var msg = "Some errors occurred during processing:";
msg += '\n\n' + textStatus + '\n\n' + errorMsg;
//g.trackError(msg, document.URL, 0);
}
});
$('#datagrid').navGrid("#navGrid", {
search: true, // show search button on the toolbar
add: false,
edit: false,
del: false,
refresh: true,
position: "left", cloneToTop: true
},
{}, // edit options
{}, // add options
{}, // delete options
{
closeOnEscape: true, multipleSearch: true, overlay: false,
closeAfterSearch: true
} // search options - define multiple search
);
$.extend(true, $.ui.multiselect, {
locale: {
addAll: 'Make all visible',
removeAll: 'Hidde All',
itemsCount: 'Avlialble Columns'
}
});
$('#datagrid').jqGrid('navButtonAdd', '#navGrid', {
caption: "",
buttonicon: "ui-icon-calculator",
title: "Choose columns",
onClickButton: function () {
debugger
$("#datagrid").jqGrid('columnChooser',
{
width: 550, msel_opts: { dividerLocation: 0.5 }, modal: true,
done: function (perm) {
debugger
if (perm) {
// "OK" button are clicked
$("#datagrid").jqGrid("remapColumns", perm, true);
// the grid width is probably changed co we can get new width
// and adjust the width of other elements on the page
// var gwdth = $("#datagrid").jqGrid("getGridParam", "width");
// $("#datagrid").jqGrid("setGridWidth", 1200);
//} else {
// // we can do some action in case of "Cancel" button clicked
}
}
});
}
});
$('#datagrid').navButtonAdd('#navGrid', {
caption: "Export",
buttonicon: "ui-icon-disk",
onClickButton:
function () {
debugger
var d = new Date();
var filename = "MISExport_" + d.getDate() + '/' + (d.getMonth() + 1) + '/' + d.getFullYear().toString() + ".xlsx";
//jQuery("#datagrid").jqGrid('jqGridExport', options);
ExportJQGridDataToExcel("#datagrid", filename);
},
position: "last"
});
$("#datagrid").jqGrid("setFrozenColumns");
});