1

I am currently having issues with Internet explorer and a Javascript that I created. I've been trying to find where the incompatibility issue originates from, but I've been unable to pinpoint it.

This works fine in Firefox 26, but it doesn't seem to actually generate a table in Internet Explorer 11.

function InsertTable()
{
column = document.getElementById("Columns").value
row = document.getElementById("Rows").value

cellwidth = 100 / column

table = '<table width="100%" border="2px">'

while(row > 0)
{
columncopy = column
table = table + '<tr>'

while(columncopy > 0)
{
table = table + '<td width="' + cellwidth + '%"></td>'
columncopy = columncopy - 1;
}

table = table + '</tr>'
row = row - 1;
}

table = table + '</table>'

document.getElementById("mainedit").focus();
document.execCommand('insertHTML', false, table);


}

Update: I managed to narrow down the issue to a single line of code, it is going through the entire thing and not actually placing it correctly.

document.execCommand('insertHTML', false, table);

Is the source of the issue.

user2994429
  • 105
  • 3
  • 14
  • Which version of Internet Explorer are you using? – Oswald Feb 02 '14 at 08:00
  • I am using IE 11, and it just simply doesn't want to generate the table. I tried adding some debugging stuff and I wasn't able to find the root of the problem. – user2994429 Feb 02 '14 at 08:03
  • Firefox 26 went through the entire process without any problem, the table was generated properly without any error. Internet Explorer 11 simply did nothing when the function was called as if it was getting stuck somewhere. – user2994429 Feb 02 '14 at 08:09
  • 1
    Welcome to hell :) Browsers compatibillity is a developer favourite love affair :) First step - go visit http://caniuse.com/ and see if there is any compatibillity issue. Next - use modernizr - http://modernizr.com/. – Miroslav Trninic Feb 02 '14 at 08:25
  • I've looked into it, and 'insertHTML' is not supported by Internet Explorer 11. – user2994429 Feb 02 '14 at 08:36
  • possible duplicate of [execCommand insertHtml in Internet Explorer](http://stackoverflow.com/questions/3398378/execcommand-inserthtml-in-internet-explorer) – fiscme Jan 20 '15 at 06:19

1 Answers1

0

I found the following code and integrated it in the following manner.

html = table

IE()


function IE()
{

var sel, range;
if (window.getSelection) {
    // IE9 and non-IE
    sel = window.getSelection();
    if (sel.getRangeAt && sel.rangeCount) {
        range = sel.getRangeAt(0);
        range.deleteContents();

        // Range.createContextualFragment() would be useful here but is
        // only relatively recently standardized and is not supported in
        // some browsers (IE9, for one)
        var el = document.createElement("mainedit");
        el.innerHTML = html;
        var frag = document.createDocumentFragment(), node, lastNode;
        while ( (node = el.firstChild) ) {
            lastNode = frag.appendChild(node);
        }
        range.insertNode(frag);

        // Preserve the selection
        if (lastNode) {
            range = range.cloneRange();
            range.setStartAfter(lastNode);
            range.collapse(true);
            sel.removeAllRanges();
            sel.addRange(range);
        }
    }
} else if (document.selection && document.selection.type != "Control") {
    // IE < 9
    document.selection.createRange().pasteHTML(html);
}


}
user2994429
  • 105
  • 3
  • 14
  • Hi, does this work with IE 11? I tried to use this solution, but it seems IE 11 returns 0 for sel.rangeCount(). BTW, I would like to insert the HTML to an iframe. – gye Apr 11 '17 at 18:22