Dynamically include .js file to build different grids

Suite and Optimus Suite 5
#1

Hello,

I was wondering if there is some way we can dynamically load an external js file to build different grids according to user selection.

Let’s say we have gridA.js , gridB.js, gridC.js etc. which all contain a function BuildGrid().

We don’t want to load any of them when page loads, but only when and if the user decides to do so.

After user decided to load gridA, he then wants to see gridB , gridA.js should “unload” and be replaced by gridB.js

Thanks

#2

Not sure if this would help you or not, but I had a similar situation where i needed to create different grids dynamically. Instead of creating a js function for each grid, i created a generic function that created the grid based on a json response from the server. The response contained all the settings and/or data for the grid.

Call to get the grid configuration settings from the server. In my case I was returning a collection of grids to create hence the for loop.

$.ajax({
url: ‘<%= Urls.UrlFor() %>’,
type: ‘POST’,
dataType: ‘json’,
contentType: ‘application/json’,
data: jsonData,
success: function (data) {

                for (var i = 0; i < data.length; i++) {
                    createGrid(data[i]);
                }
            }

        });

//function to create the grid.
this is using the object notation to create the grid as documented in
docs.dhtmlx.com/doku.php?id=dhtm … onstructor
Creating the grid this way, has pointed out many inconsistencies such, as even when you specify the column names, and the show on the grid as the header, you wont get any data to display, unless you also make a call to dhxGrid.setHeader, and the filter will row will not show if the grid data is currently empty, which is different behavior from some of the examples.

var createGrid = function (gridData) {

        var dhxGrid = new dhtmlXGridObject(gridData.Configuration);


        dhxGrid.enableSmartRendering(true, 200);
        dhxGrid.init();

        dhxGrid.setHeader(gridData.Header);
        if (gridData.ShowSearchRow) {
            dhxGrid.attachHeader(gridData.SearchFilterHeader);
        }

        //for the search boxes to show up, there has to be at least a single row of data, so i am using a default empty data set
        if (gridData.Data) {
            dhxGrid.parse(gridData.Data, "json");
        } else {
            dhxGrid.parse(emptyData, "json");

        }
    }

Good Luck
Rick

#3

Thanks for the suggestion