Insert Column change grid width in IE 11

[eiwai]

Hello,

I am trying to insert columns dynamically to grid. After insert column, grid width changed. It only happened on IE11. IE Edge,Chrome and Firefox working fine.

dhxWins = new dhtmlXWindows();

            var body = document.body,
                html = document.documentElement;

            var height = Math.max(body.scrollHeight, body.offsetHeight,
                                   html.clientHeight, html.scrollHeight, html.offsetHeight);

            if (height > 500)
                height = 500;
            w1 = dhxWins.createWindow("w1", 0, 0, 800, height);

            dhxWins.window("w1").centerOnScreen();
            dhxWins.window("w1").setModal(true);
            dhxWins.window("w1").denyResize();
            w1.button("minmax").disable();
            w1.button("park").disable();
            w1.setText("Summary");

            dhxLayout = w1.attachLayout("1C");
            dhxLayout.cells("a").hideHeader();

            schUploadForm = dhxLayout.cells("a").attachForm([
                {
                    type: "block", inputWidth: 750, list: [
                        { type: "newcolumn", offset: 5 },
                        { type: "button", name: "btnUpload", value: "Upload", offsetLeft: 0, offsetTop: 0, width: "70" },
                        { type: "newcolumn", offset: 5 },
                        { type: "button", name: "btnCancel", value: "Cancel", offsetLeft: 0, offsetTop: 0, width: "70" },
                        { type: "newcolumn", offset: 5 },
                        { type: "label", label: "<span class='labelMessage'>*Red color will not import.</span>", name: "lblMsg" },
                        { type: "newcolumn", offset: 5 },
                    ]
                },
                {
                    type: "block", inputWidth: 750, list: [
                        { type: "container", name: "schresultgrid", label: "", inputWidth: 720, inputHeight: 350, offsetLeft: 0 }
                    ]
                },
            ]);

			
			 schUploadGrid = new dhtmlXGridObject(schUploadForm.getContainer("schresultgrid"));

            schUploadGrid.setImagePath("Content/imgs/");

            schUploadGrid.setHeader("EMP ID,<div style='word-wrap: break-word;'>NAME<div>,<div style='word-wrap: break-word;'>DEPT<div>");
            schUploadGrid.setStyle("font-family:arial;font-size:8pt;font-weight:bold", "font-family:arial;font-size:8pt;border-color:#e7f1ff #a4bed4 #a4bed4 #e7f1ff", "font-family:arial;font-size:8pt;", "font-family:arial;font-size:8pt;");
            schUploadGrid.setColTypes("ro,ro,ro");
            //schUploadGrid.setInitWidthsP("10,10,10");
            schUploadGrid.setInitWidths("100,100,100");
            //schUploadGrid.enableAutoHeight(false);

            schUploadGrid.enableEditEvents(false, false, false);
            schUploadGrid.init();

           
            var count = 4;
            for (day = 1 ; day <= noOfDays; day++) {
                schUploadGrid.insertColumn(count, day + "SHIFT", "ro", "100");
                count++;
                schUploadGrid.insertColumn(count, day + "DAYIND", "ro", "100");
                count++;
                schUploadGrid.insertColumn(count, day + "DATEIND", "ro", "100");
                count++;
                schUploadGrid.insertColumn(count, day + "DAYLBL", "ro", "100");
                count++;
            }

            //schUploadGrid.insertColumn(count, "EmpCodeInd", "ro", "100");

            schUploadGrid.clearAll();

[sematik]

Unfortunately the issue is not clear.
If you add the column with the 100 px in width to your grid so the width of your grid will enlarge its width in 100 px. This is the expected behavior.
Could you please, clarify the problem with the complete demo. Here you can find a tutorial about creating a complete demo:
docs.dhtmlx.com/tutorials__auxi … pport.html

[eiwai]

Dear Sematik,

If that’s the case, is there any way to change “Container” width and height after grid load?

Thank you.

[sematik]

You may try to use the following solution:
myGrid.entBox.style.width=“1000px”;
Also you may try to use the enableAutoWidth() method:
docs.dhtmlx.com/api__dhtmlxgrid … width.html
it will extend the width of your grid container automatically to avoid the scrollbars.