Member Avatar for rrocket

What can I do not get this to work in Firefox?

document.getElementById("type_" + x).checked

When I used

alert(document.getElementById("type_" + x).checked);

to check the value it comes up fine in IE, but I get a "has no properties" error in FireFox.

  • 3 Contributors
  • 2 Replies
  • 119 Views
  • 5 Months Discussion Span
  • Latest Post Latest Post by Porthos

Dani AI

Generated

Most likely cause: Firefox is throwing that error because the call returns no element (null) and then the code tries to read .checked from null. Internet Explorer can silently behave differently (it sometimes exposes form elements as globals or matches by name), so the same code can appear to work there while Firefox fails. This complements 's checklist — the immediate thing to confirm is whether the element actually exists in the DOM at the time the code runs.

A pragmatic, cross‑browser approach is to wait for the DOM and guard the lookup before using .checked. For example, run your logic on DOMContentLoaded and verify the found node is an INPUT of the right type:

document.addEventListener('DOMContentLoaded', function () {
  var sel = '#type_' + indexValue;
  var el = document.querySelector(sel);
  if (!el) {
    console.warn('No element for', sel);
    return;
  }
  if (el.tagName !== 'INPUT' || (el.type !== 'checkbox' && el.type !== 'radio')) {
    console.warn('Found node is not a checkbox/radio', el.tagName, el.type);
    return;
  }
  console.log('checked =', el.checked);
});

Quick checklist when debugging this thread (for ): 1) Inspect the rendered HTML to confirm an id exactly matches what you expect (no leading/trailing spaces). 2) Ensure the script runs after the element exists (place script at end of body or use the DOMContentLoaded approach). 3) Check for duplicate ids or accidental reliance on name (IE may find by name; Firefox will not). 4) Use the Firefox Web Console to evaluate the selector or document.getElementById(...) directly. Useful references: Document.getElementById and HTMLInputElement.checked. This should resolve the Firefox error without changing application logic.

Recommended Answers

All 2 Replies

Member Avatar for MidiMagic

There are several possibilities, but I need to see more to tell what. The possibilities:

1. IE is not case sensitive for styles and tags. Firefox is case-sensitive. So, to be sure your ids and styles are compatible, make everything in your stylesheet and references lowercase.

2. It may depend on the browser whether it is looking for the name attribute or the id attribute. For Input boxes, it is best to provide both. But remember that all radio buttons in a group require the same name, but different ids.

3. Check for accidental capitalizations and typos.

4. Do you accidentally have two objects with the same id attribute? Do you have a different object with a name attribute which is the same as the id attribute you are using?

5. Remember that the checked attribute is boolean.

6. Are the contents of the variable x known to be a string? If not, are they known to be an integer? You may have an issue with roundoff error if the value is calculated.

7. Did you return x from a function? If so, it may be that you used a parameter passing method that returns a value on one browser, but not on another.

8. How did you declare x? It may be that, under the rules of one browser, x is outside its scope.

9. Could x have a leading blank for some reason?

10. I was told to use single quites for JavaScript strings, and double quotes for html attributes. I don't think this is a hard rule, but it might be confusing something.

Try doing this:

strig = 'type_' + x;
alert(strig);
alert(document.getElementById(strig).checked);

Look at strig and see what it really is.

Member Avatar for Porthos

Midi magic ! you are a G-D!!
thanks for the tip

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.