Best way to locate source of Warning: Empty string passed to getElementById()

Question

Warning: Empty string passed to getElementById().
Source File: chrome://browser/content/browser.xul
Line: 0

Some days ago I started getting the above message while developing my site. Things are working as they should (or at least I think they are), but I want to find out where this is coming from. I use jQuery so do not use getElementById() directly. Plus I have Firebug and the Web Developer extension for Firefox running.

I could laboriously put in code to check for an empty string being given to a jQuery selection or maybe look into jQuery itself, but my skills are minimal, so I'm asking here if anyone has offhand a good idea for quickly locating the source of the warning messages.

score 28 · Accepted Answer · answered May 28 '12 at 21:13

28

Source File: chrome://browser/content/browser.xul

This means that the error is in a Firefox extension, not in your code.

answered May 28 '12 at 21:13

lanzz

42,060
10
89
98

I love man :) You are a life savior. I was going crazy using dependent dropdowns in Yii2 and I have memorized my code lines but I was getting this stupid error. Now I just checked in IE and Chrome, and my code works like a charm. – iltaf khalid Jan 09 '15 at 14:46
One thing I noticed, my local copy works fine but the deployed version has problem so it definitely isnt browser error :( – iltaf khalid Jan 23 '15 at 12:03
indeed you are a life saver :) – mrugeshthaker Jun 06 '18 at 18:20

MattyGT · Answer 2 · 2019-07-30T11:12:40.840

22

Was receiving this warning in Firefox.

I just came across this warning and found that there were labels for input fields but the labels for attribute was not set/empty so just completing the for attribute fixed this issue for me.

// Label's for attribute not set which caused the warning in FF

e.g. <label for=''>Text</label><input type="text" name="text" id="text" value="" />

edited Jul 30 '19 at 11:12

answered Jul 29 '19 at 09:25

MattyGT

221
2
3

Sorry about that. Added example. – MattyGT Jul 30 '19 at 11:14
Just to clarify: for fixing it you need a _for_ value: e.g. `` (matching the input id). – CPHPython Jan 29 '21 at 13:02

score 8 · Answer 3 · edited Jun 10 '15 at 00:44

8

If you are querying by '#' selector -- ensure the selector is unique (as it should be) or you will end up with this error in ff

edited Jun 10 '15 at 00:44

steampowered

11,809
12
78
98

answered Dec 27 '12 at 19:35

user1898553

91
1
3

score 2 · Answer 4 · answered Aug 11 '13 at 01:18

In my case this was caused by Firefox performing HTML5 checks on the input fields on my form. Once the "required" property was removed from the form elements everything seemed to work fine again.

This was something brought about by the MVC framework I use which generates these properties based on the model validation rules that require a field to be non-empty.

score 1 · Answer 5 · answered Mar 13 '18 at 00:34

This answer was really helpful to me in finding why it was happening so I decided to share.

I've placed the following code OUTSIDE document.ready and got this error.

// Enable Line Items ONLY AFTER general info is filled out!
$( "#client_estimate_continue_next" ).click(function(e) {
//e.preventDefault();
console.log(this.id + ' click event fired.');

// DO SOMETHING...

});

I was able to fix the error by simply placing it INSIDE document.ready

Additional info:

I got the error but in my case it was coming from my own script according to FireFox.

I believe I got the error because I made a reference to the id of an element that was not yet fully rendered eg. NOT ready.

Warning: Empty string passed to getElementById().

Best way to locate source of Warning: Empty string passed to getElementById()

5 Answers5

Linked