TypeError: document.getelementbyid(...) is null

**AbhijeetM** · 10-13-2013, 09:38 AM

HTML Code:

<html>

	<head>
		<title>Port Scanner for Mozilla Firefox</title>
	</head>
	
	<body>

		<form name="my_form" id="my_form" method="post" action="#" onsubmit="return displayMessage();">
			<p align="center">URL/Domain Name/IP Address: <input type="text" size="20" name="uri" value="" placeholder="http://www.google.com" required/></p>
			<table align="center" border="1" width=100% bgcolor="#f4fff0" bordercolor="green" cellspacing="2" cellpadding="2">
				<tr>
					<td align="center">
						Start port: <input type="text" size="5" name="start_port" maxlength="5">
						End port: <input type="text" size="5" name="end_port" maxlength="5"><br>
						<input type="submit" value="Scan all ports" name="scan_all"><br>
						<input type="submit" value="Scan only open ports" name="scan_open">						
					</td>
				
				</tr>
				<tr>
					<td align="center">
						<input type="text" size="20" name="scan_tcp"><br>
						<font color="#b1b1b1">Enter port numbers separated by space. (e.g. 21 25 80)</font><br>
						<input type="submit" value="Scan TCP ports" name="scan_tcp_ports">					
					</td>
				</tr>
				<tr>
					<td align="center">
						<input type="submit" value="Scan common service ports" name="scan_common_tcp"><br>
						<input type="submit" value="Scan common Trojan ports" name="scan_common_trojan_tcp">					
					</td>
				</tr>
			</table>
		</form>
	    <script type="text/javascript">
			function displayMessage()
			{
					if(document.my_form.uri.value==0)
					{
						document.write("<font color='red'><i>Please enter URL/Domain Name/IP Address.</i></font>");
						return false;
					}
					document.write("<DIV id='loading'><BR><BR><font color='#FF6600'><i>Please wait... The ports are being scanned...</i></font></DIV>");
					document.getElementById("my_form").submit();					
			}
		    window.onload=function()
			{  
				document.getElementById("loading").style.display="none";  
		    }  
		</script>
	</body>
</html>

I want to submit above form. But it shows me JavaScript error in Console that
"TypeError: document.getelementbyid(...) is null"
This error is for code :
document.getElementById("my_form").submit();

I am using Firefox 24.0 and Windows 7. I have installed only 1 add-on. That is 'Firebug 1.12.3'.
This code works fine for other browsers Except Firefox.
Please help me to solve this problem.

**jscheuer1** · 10-13-2013, 01:38 PM

All browsers are generating that error. Of the browsers that report errors in a console, only Firefox preserves previous errors upon navigation by default. Chrome can be toggled but defaults to a fresh console window upon navigation. Other browsers may or may not be able to be toggled in this manner. Navigation occurs when the form is submitted.

The form submits because the form has:

Code:

 onsubmit="return displayMessage();"

Which means it will submit unless displayMessage returns false.

The displayMessage() function always returns undefined, as it has no return value set, except for this section:

Code:

					if(document.my_form.uri.value==0)
					{
						document.write("<font color='red'><i>Please enter URL/Domain Name/IP Address.</i></font>");
						return false;
					}

Which only fires in older browsers that do not recognize the required attribute of the uri input element. Modern browsers will not submit the form because of that if the uri field is not filled in.

If that field is filled out, then this happens:

Code:

					document.write("<DIV id='loading'><BR><BR><font color='#FF6600'><i>Please wait... The ports are being scanned...</i></font></DIV>");
					document.getElementById("my_form").submit();

When you document.write after a page is already loaded (which this page must be, because otherwise the form wouldn't be there), it wipes out the existing page and replaces it with whatever is written. So, although in some browsers the form submits because the form is in memory and this function returns undefined, by the time the code gets to:

Code:

document.getElementById("my_form").submit();

"my_form" is not there any more, it has been overwritten. Hence the error you are seeing. In Firefox though the form is not in memory so does not submit, so all you see is the loading message and the error.

I think I see what you want it to do though. When I have some more time I may try rewriting it to do that. Or you could just use a standard form validation script. There are many available around the web.

Just to get it working, replace the script with:

Code:

	    <script type="text/javascript">
			function displayMessage()
			{
					if(document.forms.my_form.uri.value==0)
					{
						alert("Please enter URL/Domain Name/IP Address.");
						document.forms.my_form.uri.focus();
						return false;
					}
					alert("The ports will be scanned when you dismiss this alert.");
					return true;				
			}
		</script>

The browser cache may need to be cleared and/or the page refreshed to see changes.

**jacobhalls** · 02-25-2019, 05:16 AM

This error TypeError: document.getelementbyid(...) is null would seem to indicate that there is no such element with an ID passed to getElementById() exist. This can happen if the JavaScript code is executed before the page is fully loaded, so its not able to find the element. The solution is that you need to put your JavaScript code after the closure of the HTML element or more generally before < /body > tag.

Thread: TypeError: document.getelementbyid(...) is null

Thread Tools

Search Thread

TypeError: document.getelementbyid(...) is null

Similar Threads

document.getElementById

Resolved document.getElementByID is null... with dropdown tabs

document.getElementById problem

document.getElementById(variable)

getElementById return null in FF

Bookmarks

Bookmarks

Posting Permissions