Isxida
Isxida

Reputation: 55

getElementsByClassName not working on firefox

I was trying to print a anual report but i need to change 2 texts around the page, one of them has only a class attribute. Im new at js so i made this.

<div id="formBusqPresElec:dtResBSPE_paginator_bottom" class="ui-paginator ui-paginator-bottom ui-widget-header">
    <span class="ui-paginator-current">Mostrando 1-20 de 1626 registros</span> 
</div>

And the other has an id.

<div id="fBusqSPE">Mostrando 20 de 1626 registros</div>

I made it work on Chrome

function imprimir() {
    var oldText = document.getElementById('fBusqSPE').innerText;
    document.getElementById('fBusqSPE').innerText = document.getElementsByClassName('ui-paginator-current')[0].innerText;
    window.print();
    document.getElementById('fBusqSPE').innerText = oldText;
}

But in firefox throws

[10:48:48.330] TypeError: document.getElementsByClassName(...)[0] is undefined

Edit: So let me explain more.

Actually im working inside 2 iframes, which the first one is for the menu, and the other one is for more options. Then the central iframe is used to show the actual report. Maybe I must define which iframe I want to retrieve those elements.

Upvotes: 1

Views: 3695

Answers (3)

fast
fast

Reputation: 885

You probably should use:

 iframe.contentDocument.getElementsByClassName(...)

(see: contentDocument for an iframe)

Upvotes: 1

Jamiec
Jamiec

Reputation: 136094

There are 2 problems here. The first causes your error of document.getElementsByClassName(...)[0] is undefined and once overcome, the second is that Firefox does not support innerText

The only way to generate the specified error in Firefox is for no elements with the specified class being present on the page. This is demonstrated by the following code

<div class="a-test"></div>
// on page load
document.getElementsByClassName("b-test")[0].innerHTML="Test"; 

JSFiddle:http://jsfiddle.net/UL2Xs/

If you watch the console when running the above fiddle, you'll see the same error as you get.

Is it possible that your javascript is running before the page has finished loading?

The second, and more minor issue is that FireFox does not support innerText. You should use .textContent or possibly .innerHTML.

Upvotes: 3

Irfan TahirKheli
Irfan TahirKheli

Reputation: 3662

Basically .innerText will not work in FF. FF uses textContent property.

var text = element.textContent;
element.textContent = "this is some sample text";

Upvotes: -2

Related Questions