Wijmo Grid - Working with Grouping with prior Definition & Export with Preview

Posted by: ylipkin on 13 August 2019, 5:29 am EST

  • Posted 13 August 2019, 5:29 am EST

    Hi Wijmo General forum,

    Our team has several questions regarding the capabilities of the Wijmo Grid:

    1. Looking at this demo for FlexGrid Aggregation (https://www.grapecity.com/wijmo/demos/Grid/Aggregation/Aggregategroup/purejs), is it possible to dynamically group or aggregate columns before displaying the data on a Grid? Our goal is to allow our users to create/manipulate profiles of selected fields, labels, aggregates, and filters. These user-created profiles are stored on our database, so these profiles will be dynamic, thus the group panel grid cannot be pre-defined as shown in the example:
    var theGrid = new wjGrid.FlexGrid('#theGrid', {
            autoGenerateColumns: false,
            columns: [
                { binding: 'id', header: 'ID', width: 60, isReadOnly: true },
                { binding: 'country', header: 'Country' },
                { binding: 'product', header: 'Product' },
                { binding: 'sales', header: 'Sales', aggregate: 'Sum' },
                { binding: 'expenses', header: 'Expenses', aggregate: 'Sum' }
            ],
            itemsSource: data
        });
    

    We understand that bindings can be done without specifying this column structure; however, is it possible to dynamically assign aggregates such as ‘Sum’ or ‘Count’.

    1. Is it possible to export Grid data into an Excel without the previewing the Grid on-screen? As the users become more familiar with their created profiles, it would be more resourceful to export the data from their profile in a single click, rather than preview the FlexGrid then export the FlexGrid.

    Any help is greatly appreciated.

    Working Environment:

    • Windows 7 64-bit
    • Visual Studio 2017
    • ASP.net with Pure Javascript for Website
    • Wijmo Enterprise version 5

    Thank you

  • Posted 13 August 2019, 6:02 am EST - Updated 3 October 2022, 10:38 am EST

    Here is a sample of our web application UI, in which the users can select Field Names and Aggregates or type column Labels.

    Thank you

  • Posted 13 August 2019, 6:18 pm EST

    Hi Yakov,

    Regarding creating the grid dynamically:

    Yes, we can assign different properties to the columns after the grid has been created. You just need to create an empty grid and assign columns and their properties later.

    Regarding exporting to excel:

    To export the grid without previewing, you will need to create an empty div element on which the grid will be created and export this grid using the saveAsync or save method.

    Please refer to the sample attached and let us know if this your requirement.

    FlexGrid_CreateCustomGrid.zip

    Regards,

    Ashwin

  • Posted 19 August 2019, 5:03 am EST

    Hi Ashwin,

    Thank you for your response.

    I was unable to startup the Custom Grid sample. I believe there may be a missing reference file.

    Do you have additional samples/tools for dynamic grid creation, such as assigning different aggregates/filters for specific dataTypes.

    For exporting the Excel, are there any alternatives to export without the blank FlexGrid? The user should be able to create profiles with 40+ columns and the resulting data accumulates to 20,000+ columns (about 80,000 cells). As a result, when performing any actions on the FlexGrid (sorting columns, resizing columns, changing values, exporting the current FlexGrid) the Internet browser hangs due to the large quantity of data shown/manipulated.

    Thank you,

    Yakov

  • Posted 19 August 2019, 3:47 pm EST

    Hi Yakov,

    We are sorry for the inconvenience caused. I have updated the sample. Please try running it again and let us know if this works for you or if you have any additional requirement.

    FlexGrid_CreateCustomGrid.zip

    Regarding exporting:

    If you do not wish to create an empty FlexGrid to export the data to excel, then you will need to create an empty Workbook and add data to it manually. Please refer to the following link that demonstrates the same:

    https://www.grapecity.com/wijmo/demos/Excel/ExpenseReport/purejs

    FlexGrid is slow with large data:

    This is expected behavior since large datasets will require more DOM manipulation and therefore the browser will freeze. But, you can speed up the data manipulation by reducing the height and width of the FlexGrid or by using paging. But, there is no way to speed up the exporting process since the conversion requires heavy processing and access to the DOM.

    ~regards

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels