$(function () { $("#Grid").ejGrid({ /// the datasource "window.gridData" is referred from jsondata.min.js dataSource: window.gridData, allowPaging: true, showSummary: true, pageSettings: { pageSize: 10 }, summaryRows: [ { title: "Sum", summaryColumns: [{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "Freight", dataMember: "Freight", format: "{0:C2}" }, { summaryType: ej.Grid.SummaryType.Sum, displayColumn: "EmployeeID", dataMember: "EmployeeID", format: "{0:C2}" }, { summaryType: ej.Grid.SummaryType.Sum, displayColumn: "OrderID", dataMember: "OrderID", format: "{0:C2}" } ] }, ], columns: [ { field: "OrderID", headerText: "Order ID", isPrimaryKey: true, textAlign: ej.TextAlign.Right, width: 80 }, { field: "EmployeeID", headerText: "Employee ID", editType: ej.Grid.EditingType.NumericEdit, textAlign: ej.TextAlign.Right, width: 80 }, { field: "Freight", headerText: "Freight", textAlign: ej.TextAlign.Right, width: 80, format: "{0:C}" } ] }); |
Query: Exception was thrown at line 10, column 54961 in http://localhost:14826/scripts/syncfusion/ej.web.all.min.js
0x800a138f - JavaScript runtime error: Unable to get property 'fn' of undefined or null reference
We were unable to reproduce the issue. Please share the following information to find the cause of the issue and provide a solution, 1. A sample or sample hosted link. 2. Full code example. 3. Essential studio version and browser details. Regards, Jayaprakash K.
[
{
"prjCode":
"ACON0001",
"activDesc":
"Archiving",
"description":
"dfdfsf",
"monday": 2.0,
"tuesday": 0.0,
"wednesday":
0.0,
"thursday": 0.0,
"friday": 0.0,
"saturday": 0.0,
"sunday": 0.0
},
{
"prjCode":
"AI0000",
"activDesc":
"Artwork (mocking)",
"description":
"rtrtrte",
"monday": 4.0,
"tuesday": 0.0,
"wednesday":
0.0,
"thursday": 0.0,
"friday": 0.0,
"saturday": 0.0,
"sunday": 0.0
},
{
"prjCode":
"AMER0001",
"activDesc":
"DTP A\u0026P (production)",
"description":
"qwere",
"monday": 3.0,
"tuesday": 0.0,
"wednesday":
0.0,
"thursday": 0.0,
"friday": 0.0,
"saturday": 0.0,
"sunday": 0.0
}
]
$("#Grid").ejGrid({
dataSource: data,
isResponsive: true,
showSummary: true,
summaryRows: [
{
title: "Total:", summaryColumns: [
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "monday",
dataMember: "monday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "tuesday",
dataMember: "tuesday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "wednesday",
dataMember: "wednesday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "thursday",
dataMember: "thursday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "friday",
dataMember: "friday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "saturday",
dataMember: "saturday" },
{ summaryType: ej.Grid.SummaryType.Sum, displayColumn: "sunday",
dataMember: "sunday" },
]
}],
endAdd: function
(args) {
vm.addTimesheet(args, $scope.dt);
},
endEdit: function
(args) {
vm.updateTimesheet(args, $scope.dt);
},
endDelete:
function (args)
{
vm.deleteTimesheet(args, $scope.dt);
},
toolbarSettings: {
showToolbar:
true,
toolbarItems: ["add", "edit", "update", "delete", "cancel"]
},
editSettings: {
allowEditing:
true,
allowAdding: true,
allowDeleting: true,
editMode: "normal",
rowPosition: "bottom",
showAddNewRow: false
},
allowScrolling: true,
allowFiltering: true,
allowSorting: true,
columns: [
{
field: "prjCode", headerText: 'Project
Code', textAlign: ej.TextAlign.Left, width:
15, editType: ej.Grid.EditingType.Dropdown, dataSource: $scope.projectList
},
{
field: "activDesc", headerText: 'Activity', textAlign: ej.TextAlign.Left, width: 15, editType:
ej.Grid.EditingType.Dropdown, dataSource: $scope.activityList
},
{ field: "description", headerText: 'Description', textAlign: ej.TextAlign.Left, width: 20 },
{ field: "monday", headerText: 'M', width: 7,type: "number", format: "{0:n}" },
{ field: "tuesday", headerText: 'T', textAlign: ej.TextAlign.Center, width: 7 },
{ field: "wednesday", headerText: 'W', textAlign: ej.TextAlign.Center, width: 7 },
{ field: "thursday", headerText: 'T', textAlign: ej.TextAlign.Center, width: 7 },
{ field: "friday", headerText: 'F', textAlign: ej.TextAlign.Center, width: 7 },
{ field: "saturday", headerText: 'S', textAlign: ej.TextAlign.Center, width: 7 },
{ field: "sunday", headerText: 'S', textAlign: ej.TextAlign.Center, width: 7 }
]
});
We have created sample with your code example and we are not using client side events(endAdd/endEdit/endDelete). Because we don’t know what you have done in clientside events. But we were unable to reproduce the issue. Please share the following information to find the cause of the issue and provide a solution,
1. An issue reproducing sample if possible or sample hosted link or replicate the issue in the following sample.
Sample: http://jsplayground.syncfusion.com/2gqf1nsy
2. Essential studio version and browser details
Regards,
Jayaprakash K.
Did anyone ever find a solution to this? I'm having the same problem.
I can get the fn error to go away if I set allowPaging to true, but the summary lines don't appear after a reload where each time I'm re-drawing the whole grid.