DataGrid Hidden Column is Showing in IE 11

Suite and Optimus Suite 5
#1

I am having a problem I cannot seem to reproduce on my computer, but it persists on my manager’s computer.
The problem occurs in the Internet Explorer 11 (IE11) when column is supposed to be hidden, but instead it is showing in the grid.
I am not sure if my initialisation is wrong and if I understand things correctly like am I supposed to set hidden column attributes or not? :bulb: :question:
At the moment I am using standard DHTMLX suite and in one of my pages I initialise DataGrid with the following code:

  var dGrid;  // Set globaly
  var jsonAvailableUsers; // Global array of JS objects obtained via Ajax call and parsed with JSON.parse

  // inside the init function:
  function initDGrid()
  {
    dGrid = new dhtmlXGridObject('UserGridContainer');
    dGrid.setImagePath("dhtmlx/imgs/");
    dGrid.setHeader("User,Assign,UserID", null, ["text-align:left;font-size:11px;","text-align:center;font-size:11px;"]);
    dGrid.setInitWidths("*,50,*");
    dGrid.setColAlign("left,center,left");
    dGrid.setSkin("dhx_skyblue");
    dGrid.setColSorting("str,str,str");
    dGrid.setColTypes("ro,ch,ro");
    dGrid.setColumnHidden(2, true);
    dGrid.init();
    dGrid.makeFilter("searchFilterField", 0);
    dGrid.parse(jsonAvailableUsers, "json");  // jsonAvailableUsers - data obtained via web service using Ajax request

    dGrid.attachEvent("onRowSelect", function(rowID, cellInd)
    {
    });
	
    dGrid.attachEvent("onCheckbox", function(rowID, cellInd, state)
    {
      saveData(dGrid.cells(rowID, 2).getValue(), state);	// Get UserID (hidden column) to pass as parameter
    });
  }

Aside of the initialisation code, once the data changes (add/delete/update) to reflect the data changes I am using the following code to reload the data inside the grid:

  function updateDGrid()
  {
    dGrid.clearAll();
    dGrid.parse(jsonAvailableUsers, "json");
    dGrid.refresh();
  }

Could you please advise me if my code is used correctly to initialise and refresh the DataGrid, or what would be the better way to handle this if this is not the proper way… :question:
Also, would you know what could cause the column to be showing (NOTE: the column being set as hidden when displayed in IE it is displayed with default style applied to it (e.g. font size 12) while rest of the columns are showing in set style (e.g. font size 11) :question:

Please help.

Thank you in advance!

#2

please, make sure that you are using a valid html5 doctype on your page:

Also please, make sure that you are using the standard document mode in the emulation tab in your IE11 browser.

#3
is set on every page including the one where I have my grid.

I do not have control over the Document mode in IE.
Currently X-UA compatible meta tag is set on the index.html page, and is forcing IE document mode “8 (Default)”.

However, please note that this applies to my IE as well, but I am not seeing the hidden column i.e. it is only visible on my manager’s computer.

#4

I have changed the User agent string setting from “Internet Explorer 11 (Default)” to “Internet Explorer 8” and now the hidden column is not working in my browser either.

So basically, to reproduce the problem, these are the settings in Developer Tools: Document mode “8 (Default)” set via meta tag and User agent string “Internet Explorer 8”.

#5

Unfortunaetly the issue cannot be reconstructed locally.
Please, try to hide your columns after the init of your header:
dGrid.init();
dGrid.setColumnHidden(2, true);

If the problem still occurs for you please, provide a complete demo, or a demo link where the problem can be reconstructed locally.