We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Possible Memory Leak using Custom Context Items in Grid

Hi,

I begin to have a memory issue when selecting the custom context menu. The way to trigger is really strange. I load the grid pick one item and them without picking the next one using right click over other item to load the custom context.

My grid definition is

<div id="gridPanelDetails" class="row">
            @(Html.EJ().Grid<DocTracerPortal.Models.Visual.VisualGridDocument>
                ("GridDocumentDetails")
                .Datasource((IEnumerable<DocTracerPortal.Models.Visual.VisualGridDocument>
                    )ViewBag.documentVisualResultsSource)
                    .AllowSorting()
                    .IsResponsive(true)
                    .AllowSelection(true)
                    .AllowResizeToFit(true)
                    .ShowColumnChooser()
                    .AllowRowDragAndDrop()
                    .RowDropSettings(drop => drop.DropTargetID("#GridLinkedDocuments"))
                    .AllowGrouping()
                    .SelectionType(SelectionType.Multiple)
                    .SelectionSettings(select => { select.SelectionMode(mode => { mode.AddMode(SelectionMode.Row); }); })
                    .ContextMenuSettings(contextMenu =>
                    {
                        contextMenu.EnableContextMenu()
                        .CustomContextMenuItems(new List<Syncfusion.JavaScript.Models.CustomContexMenuItems>
                            () {
                        new  Syncfusion.JavaScript.Models.CustomContexMenuItems() { Id = "1", Text = "Download <img src='/Images/grid_DocumentDetails/options/download.png' style='width:20px;height:20px' />" } ,
                        //new  Syncfusion.JavaScript.Models.CustomContexMenuItems() { Id = "2", Text = "Open file <img src='/Images/grid_DocumentDetails/options/open-16x16.png' style='width:20px;height:20px' />" } ,//Not possible in mobile
                        new  Syncfusion.JavaScript.Models.CustomContexMenuItems() { Id = "3", Text = "Check Group Security <img src='/Images/grid_DocumentDetails/options/securityAssignment_16px.png' style='width:20px;height:20px' />" } ,
                        new  Syncfusion.JavaScript.Models.CustomContexMenuItems() { Id = "4", Text = "Maintenance View <img src='/Images/grid_DocumentDetails/options/maintenance_16x16.png' style='width:20px;height:20px' />" } ,
                        new  Syncfusion.JavaScript.Models.CustomContexMenuItems() { Id = "5", Text = "Notifications Details <img src='/Images/grid_DocumentDetails/options/documentNotifications_20px2.png' style='width:20px;height:20px' /> " } ,
                            }); // CustomContext menu items

                    })
                        .ClientSideEvents(eve =>
                        {
                            eve.ContextClick("contextClickServerStorage").ContextOpen("contextOpenServerStorage").RecordClick("rowSelectServerStorage");
                            eve.ActionComplete("actionComplete").RecordDoubleClick("doubleClickServerStorage");
                            eve.RowDrop("rowDropHandlerOrigin").RowDrag("onRowDrag");
                        })
                        .ToolbarSettings(toolbar =>
                        {
                            toolbar.ShowToolbar().ToolbarItems(items =>
                            {
                                items.AddTool(ToolBarItems.PrintGrid);
                                items.AddTool(ToolBarItems.ExcelExport);
                                items.AddTool(ToolBarItems.WordExport);
                                items.AddTool(ToolBarItems.PdfExport);
                            });
                        })
                        .Mappers(map => map.ExportToExcelAction("/DocumentDetails/ExportToExcel").ExportToPdfAction("/DocumentDetails/ExportToPdf").ExportToWordAction("/DocumentDetails/ExportToWord"))
                        .AllowResizing(true)
                        //.AllowPaging()
                        .AllowFiltering()
                        //.FilterSettings(filter => { filter.FilterType(FilterType.Excel); })
                        .FilterSettings(filter => { filter.FilterType(FilterType.Menu); })
                        //.FilterSettings(d => d.FilterType(FilterType.FilterBar))
                        .Columns(col =>
                        {
                            col.HeaderText("In/Out").Template("#ColumnStatus").TextAlign(TextAlign.Center).Add();
                            col.HeaderText("Options").Template("#ColumnOption").TextAlign(TextAlign.Left).Width(160).Add();
                            col.HeaderText("Versions").Template("#ColumnVersions").TextAlign(TextAlign.Left).Width(80).Add();
                            col.Field(p => p.Name).HeaderText("Name").Tooltip("#colTip").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DocumentNumber).Tooltip("#colTip").HeaderText("Document #").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DocumentTitle).HeaderText("Document Title").Tooltip("#colTip").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DocumentStatusName).Tooltip("#colTip").HeaderText("Document Status").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DocumentRevisionNumber).Tooltip("#colTip").HeaderText("Revision #").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.TransmittalNumber).Tooltip("#colTip").HeaderText("Transmittal Number").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DateReceivedString).Tooltip("#colTip").HeaderText("Date Received").TextAlign(TextAlign.Left).Format("{0:MM/dd/yyyy hh:mm:ss}").Add();
                            col.Field(p => p.AreaName).Tooltip("#colTip").HeaderText("Area").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.DocumentCategoryName).Tooltip("#colTip").HeaderText("Category").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.Tags).Tooltip("#colTip").HeaderText("Tags").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.Comments).Tooltip("#colTip").HeaderText("Comments").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.PageSize).Tooltip("#colTip").HeaderText("Page Size").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.OriginalSize).Tooltip("#colTip").HeaderText("Size").TextAlign(TextAlign.Left).Add();
                            //col.Field(p => p.DocumentTitle).HeaderText("Linked").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.Extension).Tooltip("#colTip").HeaderText("Ext").TextAlign(TextAlign.Left).Add();
                            col.Field(p => p.NumberOfPages).Tooltip("#colTip").HeaderText("Pages").TextAlign(TextAlign.Left).Add();
                        })

            )
        </div>


The issue happens in Edge, FF and Chrome without any difference. I use the grid in another page in a similar way with different data and I do not have the issue.

I will attach some gifs that show erratic behaviour. 

If you have any suggestions that could help me to solve the issue, I will really appreciate it.
Kind regards,

Juan Acosta


Attachment: MemoryLeak_4de902ec.7z

3 Replies

VA Venkatesh Ayothi Raman Syncfusion Team December 8, 2016 06:53 AM UTC

Hi Juan, 
Thanks for contacting Syncfusion support. 
We were unable to reproduce the issue at our end and we went through your code example and found that you are using context click and context open events. Could you please share following details? 
1)      We suspect that reported issue comes from functions like contextClick and contextOpen. So please provide code definition of custom context click and contextOpen function. 
2)      Share the sample if possible or share the hosted link of the sample. 

Regards, 
Venkatesh Ayothiraman. 



JA Juan Acosta December 8, 2016 08:25 AM UTC

Hi Venkatesh,

This is the code requested.

function contextClickServerStorage(args) {
    console.log('args ' + args.ID);
    console.log('selected items ' + this.getSelectedRecords().length);
    // remove repeated items
    var result = _.uniq(this.getSelectedRecords(), 'Id');
    console.log('cleaned selected items ' + result.length);
    //console.log('details ' + JSON.stringify(result));
    switch (args.ID) {
        case "1"://Download
            contextDownloadOption(result);
            break;
        case "2"://Check Group Security
            contextGroupSecurityOption(result);
            break;
        case "3"://Maintenance View
            contextMaintenanceViewOption(result);
            break;
        case "4"://Notify updated
            contextNotificationViewOption(result);
            break;
        case "5"://Open file
            contextOpenFileOption(result);
            break;

    }
}

function contextOpenServerStorage(args) {
    if (!ej.isNullOrUndefined(rowIndex)) {
        this.selectRows(rowIndex);
        console.log(this.selectRows(rowIndex));
        //this.getRowByIndex(rowIndex[0]).css("color", "red");
    }
}

Unfortunately, it is not as simple as separate the code and creates an example for testing purposes. My current solution has around 20k lines.

I was wondering, why this call to contextOptions could generate the memory leak. I have another screen with similar code and different data and options. In that screen, the context works perfectly.

There is any way to active a debug log of Syncfusion libraries, so, I can follow up what is happening?

I fix it temporally with a work around adding custom toolbar icons and removing the call to customContext.

If you have more suggestions, please let me know.

Kind regards,

Juan



MF Mohammed Farook J Syncfusion Team December 9, 2016 12:14 PM UTC

Hi Juan, 
 
 
We have validated your reported issue but we were unable to reproduced at our end. Please find the general  link for memory leak issue. 
 
 
 
Validate memory leak issue as step by  step : https://developers.google.com/web/tools/chrome-devtools/memory-problems/ 
 
Regards, 
J.Mohammed Farook 


Loader.
Up arrow icon