Hi,
I am using @(Html.EJ().Grid in my view razor and the grid is using grouping. the complete code is posted below.
I am using the below ajax call and the setting the groupsetting on call back method on sucess, it work fine in IE browser but the the grouping breaks in Chrome while setting groupsettings in success call back... I spent many hours and could not make it work and could not get any proper answer in googel.
Could you please help me on this. Thanks
function ajaxRequestToWebApi(startDate, endDate) {
debugger;
var gridObj = $("#AccountSessionSummary").ejGrid("instance");
var sortedColumn = gridObj._cSortedColumn;
var sortOrder = gridObj._cSortedDirection;
var groupCaptionformat = gridObj._captionFormat;
$.ajax({
//url: GET with servicediscovery!Controller/Action
url:
'Session/GetSessionSummaryDetails',
type: "GET",
data: {
accountNumber: $('#accountNumber').val(),
casinoId: $('#casinoId').val(),
gamingServerId: $('#gamingServerId').val(),
filterStartDate: startDate,
filterEndDate: endDate
},
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (data) {
gridObj.setModel({
dataSource: data,
allowResizing: true,
isResponsive: true,
allowSorting: true,
allowGrouping: true,
showSummary: true,
//summaryRows: [{title: "Total",summaryColumns: [{summaryType: ej.Grid.SummaryType.Sum,displayColumn: "Income",dataMember: "Income" }] }],
groupSettings: {
groupedColumns: ["Description"],
showGroupedColumn: true,
captionFormat: groupCaptionformat,
showDropArea: false
}
});
gridObj.sortColumn(sortedColumn, sortOrder);
},
error: function (xhr, status, error) {
gridObj.setModel({
dataSource: ej.DataManager(datasource).executeLocal(ej.Query()),
allowResizing: true,
isResponsive: true,
allowSorting: true,
allowGrouping: true,
showSummary: true,
//summaryRows: [{title: "Total",summaryColumns: [{summaryType: ej.Grid.SummaryType.Sum,displayColumn: "Income",dataMember: "Income" }] }],
groupSettings: {
groupedColumns: ["Description"],
showGroupedColumn: true,
captionFormat: groupCaptionformat,
showDropArea: false
}
});
gridObj.sortColumn(sortedColumn, sortOrder);
}
});
}
Razor view
@(Html.EJ().Grid<Session>("AccountSessionSummary").Datasource((IEnumerable<Session>)ViewBag.dataSource).IsResponsive(false).AllowResizing(true).AllowGrouping().AllowSorting()
.AllowTextWrap().AllowScrolling().ShowSummary().SummaryRow(row => row.Title("Total").ShowCaptionSummary().SummaryColumns(col =>
{
col.SummaryType(SummaryType.Sum).DisplayColumn("Income").DataMember("Income").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("Payout").DataMember("Payout").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Average).DisplayColumn("Margin").DataMember("Margin").Format("{0:p}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("NumberOfBets").DataMember("NumberOfBets").Format("{0:n0}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("NumberOfPayouts").DataMember("NumberOfPayouts").Format("{0:n0}").Add();
col.SummaryType(SummaryType.Average).DisplayColumn("AverageBet").DataMember("AverageBet").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Maximum).DisplayColumn("MaxPayOut").DataMember("MaxPayOut").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("NetWinXTopUp").DataMember("NetWinXTopUp").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("Bonuses").DataMember("Bonuses").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
col.SummaryType(SummaryType.Sum).DisplayColumn("Deposits").DataMember("Deposits").Prefix(@ViewBag.Currency).Format("{0:n2}").Add();
}).Add()).AllowSelection(true)
.GroupSettings(group => group.ShowDropArea(false).ShowGroupedColumn(true).CaptionFormat("#captiontemplate").GroupedColumns(col => col.Add("Description")))
.Columns(col =>
{
col.Field(s => s.Description).TextAlign(TextAlign.Left).HeaderText("Game").HeaderTextAlign(TextAlign.Left).Template("#descriptionTemplate").
Width(100).Add();
col.Field(s => s.Income).Format("{0:C2}").Template("<span>{{:AccountCurrencySymbol}}{{:IncomeStr}}</span>").Width(60).Add();
col.Field(s => s.Payout).Format("{0:C2}").Template("<span>{{:AccountCurrencySymbol}}{{:PayoutStr}}</span>").Width(60).Add();
col.Field(s => s.Margin).Width(65).Format("{0:n2}").Add();
col.Field(s => s.NumberOfBets).HeaderText("Number of Bets").Format("{0:n0}").Width(60).Add();
col.Field(s => s.NumberOfPayouts).HeaderText("Number of Payouts").Format("{0:n0}").Width(60).Add();
col.Field(s => s.AverageBet).HeaderText("Average Bet").Format("{0:C2}").Template("<span>{{:AccountCurrencySymbol}}{{:AverageBetStr}}</span>").Width(50).Add();
col.Field(s => s.MaxPayOut).HeaderText("Max Payout").Format("{0:C2}").Template("<span>{{:AccountCurrencySymbol}}{{:MaxPayOutStr}}</span>").Width(50).Add();
col.Field(s => s.NetWinXTopUp).HeaderText("Net Win").Format("{0:C2}").Template("<span>{{:AccountCurrencySymbol}}{{:NetWinXTopUptStr}}</span>").Width(60).Add();
col.Field(s => s.Deposits).HeaderText("Deposits").Format("{0:n2}").Template("<span>{{:AccountCurrencySymbol}}{{:DepositsStr}}</span>").Width(60).Add();
col.Field(s => s.Bonuses).HeaderText("Bonuses").Format("{0:n2}").Template("<span>{{:AccountCurrencySymbol}}{{:BonusesStr}}</span>").Width(60).Add();
col.HeaderText("").Width(30).Add();
}).ClientSideEvents(evt => evt.Create("onGridCreate").ActionComplete("onActionComplete")))
