Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    getHeaderContextMenuItems SubMenu issue

    I am overiding the HeaderContextMenuItem for all of my list grids
    now when adding a submenu my click menu argument doesnt have the grid object as my main menu does
    Code:
                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:this, 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;
                };
    am i missing something here?

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

    Comment


      #3
      can the parent menu be accessed from the submenu ? or what is the best way to access the grid from the submenu click function ?
      Last edited by mabboud; 20 Apr 2018, 06:49.

      Comment


        #4
        "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.

        Comment


          #5
          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);
                  }
              }

          Comment


            #6
            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.

            Comment


              #7
              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

              Comment


                #8
                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.

                Comment


                  #9
                  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?

                  Comment


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

                    Comment


                      #11
                      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

                      Comment


                        #12
                        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.

                        Comment

                        Working...
                        X