Announcement

**Isomorphic** · 19 Apr 2018, 16:03

This is expected - submenus are indeed created as separate menu instances.

**mabboud** · 20 Apr 2018, 04:37

can the parent menu be accessed from the submenu ? or what is the best way to access the grid from the submenu click function ?

**Isomorphic** · 20 Apr 2018, 07:53

"grid" is already a local variable here, so you can simply refer to it. That's how JavaScript works in general, it's called lexical closure if you want to look it up.

**mabboud** · 20 Apr 2018, 08:49

i can't use grid thats already defined since its temp variable here is the full function
basically created my own create function for ListGrid to add the menu point to all my grids

Code:

    this.ListGrid = new function()
    {
        this.create = function(grid)
        {
            var uKey = <%= JSPUtil.getUserKey(request) %>;
            var cleanURLPath = getCleanURLPath();
            var viewState=listGridViewStateLookup(uKey,cleanURLPath+"."+grid.ID);
            if (viewState)
            {
                grid.viewState = viewState;
            }
            grid.getHeaderContextMenuItems = function(fieldNum){
                var wsHeaderContextMenuItems = this.Super('getHeaderContextMenuItems', fieldNum);
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {isSeparator :true};
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {title: i18n.t("saveColumnCustom"),  
                    click: function(target, item, menu)
                    {
                        var viewStates = isc.DataSource.getDataSource("ViewStates");
                        if ( !viewStates )
                            alert("missing ViewStates DS!!");
                        else
                        {
                            viewStates.fetchData(
                                {userKey:uKey , listGridName: menu.grid.ID},
                                function(dsResponse,data,dsRequest) {
                                    if (data.length > 0 )
                                    {
                                        data[0].userKey = uKey;
                                        data[0].viewState = menu.grid.getViewState();
                                        data[0].listGridName = menu.grid.ID;
                                        viewStates.updateData(data[0]);                                        
                                    }else{
                                        var nRec={};
                                        nRec.userKey = uKey;
                                        nRec.viewState = menu.grid.getViewState();
                                        nRec.listGridName = menu.grid.ID;
                                        viewStates.addData(nRec);                                        
                                    }

                                }
                            );
                        }
                    },
                    icon:"[SKIN]/../actions/save.png"
                };

                // ADD EXPORTING Menu and SubMenu
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = 
                    {title: i18n.t("exportAs"), icon: "[SKIN]/../actions/download.png",grid:grid, submenu: [
                        {title: i18n.t("XML"), click: function(target, item, menu){
                                menu.grid.exportData({ exportAs: 'xml',exportDisplay: 'download'});
                            }
                        },
                        {title: i18n.t("CSV"), click: "menu.grid.exportData({ exportAs: 'csv',exportDisplay: 'download'})"},
                        {title: i18n.t("Excel"), click: "menu.grid.exportData({ exportAs: 'xls',exportDisplay: 'download'})"}
                    ]};

                return wsHeaderContextMenuItems;
            };

            return isc.ListGrid.create(grid);
        }
    }

**Isomorphic** · 20 Apr 2018, 08:53

That's an invalid way of creating a ListGrid - the parameter to create() should be an Object, not a function. You need to remove this pattern everywhere you are using it.

If you instead did this in the valid way, you'd have the grid as a variable that would work with lexical closure.

**mabboud** · 20 Apr 2018, 09:47

i am doing this way to standardize all of my list grid creations and not duplicate an code over and over here is a full test case

Code:

<HTML>
<HEAD>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<SCRIPT>
    window.isc_useSimpleNames = false; 
    var isomorphicDir='../isomorphic/';
</SCRIPT>
<SCRIPT SRC="../isomorphic/system/modules/ISC_Core.js"></script>
<SCRIPT SRC="../isomorphic/system/modules/ISC_Foundation.js"></script>
<SCRIPT SRC="../isomorphic/system/modules/ISC_Containers.js"></script>
<SCRIPT SRC="../isomorphic/system/modules/ISC_Grids.js"></script>
<SCRIPT SRC="../isomorphic/system/modules/ISC_Forms.js"></script>
<SCRIPT SRC="../isomorphic/system/modules/ISC_DataBinding.js"></script>
<SCRIPT SRC="../isomorphic/skins/Tahoe/load_skin.js"></script>
</HEAD>
<BODY>
<SCRIPT>

var myPackage = new function()
{
    this.ListGrid = new function()
    {
        this.create = function(grid)
        {
            grid.getHeaderContextMenuItems = function(fieldNum){
                var wsHeaderContextMenuItems = this.Super('getHeaderContextMenuItems', fieldNum);
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {isSeparator :true};
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {title: "saveColumnCustom",  
                    click: function(target, item, menu)
                    {
                        alert("Hello i am Grid: "+ menu.grid.ID);
                    },
                    icon:"[SKIN]/../actions/save.png"
                };
                // ADD EXPORTING Menu and SubMenu
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = 
                    {title: "Export As", icon: "[SKIN]/../actions/download.png",grid:this, submenu: [
                        {title: "XML", click: function(target, item, menu){
                                menu.grid.exportData({ exportAs: 'xml',exportDisplay: 'download'});
                            }
                        },
                        {title: "CSV", click: "menu.grid.exportData({ exportAs: 'csv',exportDisplay: 'download'})"},
                        {title: "Excel", click: "menu.grid.exportData({ exportAs: 'xls',exportDisplay: 'download'})"}
                    ]};
                return wsHeaderContextMenuItems;
            };

            return isc.ListGrid.create(grid);
        }
    }
}


</SCRIPT>

<SCRIPT>

var countryData = [
{
    continent:"North America",
    countryName:"United States",
    countryCode:"US",
    area:9631420,
    population:298444215,
    gdp:12360.0,
    independence:new Date(1776,6,4),
    government:"federal republic",
    government_desc:2,
    capital:"Washington, DC",
    member_g8:true,
    article:"http://en.wikipedia.org/wiki/United_states"
},
{
    continent:"Asia",
    countryName:"China",
    countryCode:"CH",
    area:9596960,
    population:1313973713,
    gdp:8859.0,
    government:"Communist state",
    government_desc:0,
    capital:"Beijing",
    member_g8:false,
    article:"http://en.wikipedia.org/wiki/China"
}];


myPackage.ListGrid.create({
    ID: "countryList",
    width:500, height:224, alternateRecordStyles:true,
    fields:[
        {name:"countryCode", title:"Flag"},
        {name:"countryName", title:"Country"},
        {name:"capital", title:"Capital"},
        {name:"continent", title:"Continent"}
    ]
})

isc.IButton.create({
    left:0, top:240,
    title: "Show all",
    click: "countryList.setData(countryData)"
})

</script>
</body>
</html>

Attached Files

myPackageTest.html (3.0 KB, 238 views)

**Isomorphic** · 20 Apr 2018, 15:35

Minimizing code is great, but there is no reason to do it in an invalid way - this is unnecessary. Please revisit the QuickStart Guide to see how reusable classes can be correctly created.

It is very important to make these changes right away, as no issue reports will be accepted with invalid code like this.

**mabboud** · 23 Apr 2018, 05:00

thanks for the responses i have changed it to define a new class as follow

Code:

        isc.ClassFactory.defineClass("AvistaListGrid","ListGrid");
        isc.AvistaListGrid.addProperties({
            viewState: function(){
                var cleanURLPath = getCleanURLPath();
                var uKey = <%= JSPUtil.getUserKey(request) %>;
                var viewState=listGridViewStateLookup(uKey,cleanURLPath+"."+this.ID);
                if (viewState)
                {
                    return viewState;
                }
            }, 
            // --- Instance Methods ---
            initWidget : function () {
                // call superclass implementation
                this.Super("initWidget", arguments);
                var cleanURLPath = getCleanURLPath();
                var uKey = <%= JSPUtil.getUserKey(request) %>;
                var viewState=listGridViewStateLookup(uKey,cleanURLPath+"."+this.ID);
                if (viewState)
                {
                    this.setViewState(viewState);
                }
            },
            getHeaderContextMenuItems : function(fieldNum){
                var grid = this;
                var wsHeaderContextMenuItems = this.Super('getHeaderContextMenuItems', fieldNum);
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {isSeparator :true};
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = {title: i18n.t("saveColumnCustom"),  
                    click: function(target, item, menu)
                    {
                        var viewStates = isc.DataSource.getDataSource("ViewStates");
                        if ( !viewStates )
                            alert("missing ViewStates DS!!");
                        else
                        {
                            var uKey = <%= JSPUtil.getUserKey(request) %>;
                            viewStates.fetchData(
                                {userKey:uKey , listGridName: menu.grid.ID},
                                function(dsResponse,data,dsRequest) {
                                    if (data.length > 0 )
                                    {
                                        data[0].userKey = uKey;
                                        data[0].viewState = menu.grid.getViewState();
                                        data[0].listGridName = menu.grid.ID;
                                        viewStates.updateData(data[0]);                                        
                                    }else{
                                        var nRec={};
                                        nRec.userKey = uKey;
                                        nRec.viewState = menu.grid.getViewState();
                                        nRec.listGridName = menu.grid.ID;
                                        viewStates.addData(nRec);                                        
                                    }

                                }
                            );
                        }
                    },
                    icon:"[SKIN]/../actions/save.png"
                };

                // ADD EXPORTING Menu and SubMenu
                wsHeaderContextMenuItems[wsHeaderContextMenuItems.length] = 
                    {title: i18n.t("exportAs"), icon: "[SKIN]/../actions/download.png", submenu: [
                        {title: i18n.t("XML"), click: function(target, item, menu){
                                grid.exportData({ exportAs: 'xml',exportDisplay: 'download'});
                            }
                        },
                        {title: i18n.t("CSV"), click: "menu.grid.exportData({ exportAs: 'csv',exportDisplay: 'download'})"},
                        {title: i18n.t("Excel"), click: "menu.grid.exportData({ exportAs: 'xls',exportDisplay: 'download'})"}
                    ]};

                return wsHeaderContextMenuItems;
            }

        }
        );

looks like it works as intended
but would like to make sure i didn't miss any thing and this is what you had in mind for reusable classes?

**Isomorphic** · 23 Apr 2018, 14:54

This is now fine other than the oddness of naming a function "viewState" - should probably be something like getCustomViewState() instead.

**mabboud** · 23 Apr 2018, 16:23

that function is not in use i was trying to over ride the
https://www.smartclient.com/isomorph...Grid.viewState

for the initial setting of the listgrid but that never executed so i assigned the view state through the initWidget

**Isomorphic** · 23 Apr 2018, 17:23

You can not override a property with a function. It's not clear what you hoped would happen, but if you want to assign to viewState, do so via a setViewState() call. This could be done via initWidget() or at another time.

Announcement

getHeaderContextMenuItems SubMenu issue

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment