CODEWITHSUNDEEP
javascriptexcel
AlexShevyakov
AlexShevyakov

Reputation: 423

Object doesn't support property or method 'getElementsById' in IE11

I am trying to use java-script to export html data into excel. The funny thing is that it DOES work when I use getElementsByTagName instead of getElementById. However, I need to pinpoint id elements and thus 'getElementById' is what I need (I guess). When I debug the below code in IE it gives me:

Object doesn't support property or method 'getElementsById'

Here is what I've got:

HTML (as an idea only):

<body>
<table>
<tr>
  <td>content 1</td>
  <td>content 2</td>
      <td id="R">content I need</td>
      <td>some other content</td>
   </tr>
</table>
</body>

and accompanying JS

<script type="text/javascript">
function write_to_excel() 
{
str="";

var mytable = document.getElementById("R")[0];
var row_Count = mytable.rows.length;
var col_Count = mytable.getElementById("R")[0].getElementById("R").length;    

var ExcelApp = new ActiveXObject("Excel.Application");
var ExcelSheet = new ActiveXObject("Excel.Sheet");
ExcelSheet.Application.Visible = true;

for(var i=0; i < row_Count ; i++) 
{   
    for(var j=0; j < col_Count; j++) 
    {           
        str= mytable.getElementById("R")[i].getElementById("R")[j].innerHTML;
        ExcelSheet.ActiveSheet.Cells(i+1,j+1).Value = str;
    }
}
}
</script>

I have the feeling - it's trifle but ... Thanks in advance!)

Upvotes: 2

Views: 6038

Answers (2)

slebetman
slebetman

Reputation: 113896

The getElementById method returns a single DOM element (if you have more than one HTML element with the same ID then your page is buggy but browsers won't complain because 10 years ago it was a common bug that lots of people make). As such the statement:

document.getElementById("R")[0]

Makes no sense whatsoever. Instead, what you want is:

var myTD = document.getElementById("R");

If you have a page structure like this:

<table id='T'>
<tr>
  <td>content 1</td>
  <td>content 2</td>
  <td>content I need</td>
  <td>some other content</td>
</tr>
</table>

And want to iterate each column in each row, you'd do it like this:

var mytable = document.getElementById("T");
var table_rows = mytable.getElementsByTagName('tr');
for (var row=0;row<table_rows.length;row++) {
    var row_columns = table_rows[row].getElementsByTagName('td');
    for (var col=0;col<row_columns.length;col++) {
        var item = row_columns[col];
        // process item here
    }
}

See the documentation of HTMLElement for more info on how to navigate the DOM: https://developer.mozilla.org/en/docs/Web/API/Element

Full documentation of the DOM API: https://developer.mozilla.org/en/docs/DOM

You may also check out the relevant docs on MSDN instead of MDN for IE specific stuff but I prefer MDN because it documents the compatibility level (what other browsers implement a feature) of the API.

Upvotes: 2

SLaks
SLaks

Reputation: 887453

IDs must be unique.

Therefore, the function you're looking for is called getElementById (singular)

Upvotes: 2

Related Questions