Ask A Question

Notifications

You’re not receiving notifications from this thread.

Chrome Only - getElementsByClassName error

Mountaindog asked in Javascript

I am hoping someone might be able to shed some light on this issue. I have this JS code (below) located in packs -> application.js. It grabs the class name and adds additional class. The division's names are temp placeholders. When running in development mode, it works great in all browsers (Chrome, FF, Safari). When tested in a production environment, it works only in FF and Safari. Not in Chrome. Hmmm.... I’ve tried moving the code out of Webpacker (application.js) and received the same results.

The only error Chrome gives is: Uncaught TypeError: Cannot read properties of null (reading 'classList')

I’m certainly open to suggestions, ideas, improvements.

window.addEventListener("load", function (event) {
var divisions = ['one', 'two', 'three', 'four', 'five', 'six']
divisions.forEach(function (item) {
var director_office = document.getElementById(item).getElementsByClassName('google-visualization-orgchart-table')
director_office.item(0).classList.add('table')
})
})

Rails: 6.0.4.4
Ruby: 2.7.3

Reply
Join the discussion
Create an account Log in

Want to stay up-to-date with Ruby on Rails?

Join 81,842+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    Screencast tutorials to help you learn Ruby on Rails, Javascript, Hotwire, Turbo, Stimulus.js, PostgreSQL, MySQL, Ubuntu, and more.

    © 2024 GoRails, LLC. All rights reserved.