How can you solve getElementById Returns Null in Apex Form on Visualforce Page error effectively?

Question

I'm attempting to make a form on a Visualforce page that will, when a button is clicked, grab the contents of a SelectList and 2 InputFields and then perform some actions with those values via a function in Javascript.

However, the contents of these fields are always returned as null by document.getElementById(). I have tried using both the '{!$Component.path.to.id}' and the 'path.to.id' approaches with no luck

For privacy reasons I've obfuscated/shortened some of the code below, but I hope it will suffice:

Visualforce Page:

Filters

Platform

Product

Client

<button type="button" class="btn btn-primary" onclick="override()" fdprocessedid="eeqbsm">Click Dat Button</button>

[removed][removed] [removed] function override(){ //grab the contents of our fields by using their unique IDs var override_plat = document.getElementById('page1.block1.form1.overr_plat'); //returns null var override_prod = document.getElementById('{!$Component.page1.block1.form1.overr_prod}'); //also returns null } [removed]

Any insight is greatly appreciated.

Anushri Singh · Accepted Answer

You do not include the page's ID to solve getelementbyid returns null: var override_prod = document.getElementById('{!$Component.block1.form1.overr_prod}');

How can you solve getElementById Returns Null in Apex Form on Visualforce Page error effectively?

About this question

Your answer

1 Answer

More Salesforce discussions

Learn & Explore

Salesforce Tutorials

Salesforce Interview Q&A

Latest Salesforce Blogs

Want answers to more Salesforce questions?

Stay in the loop — it’s free

You’re on the list!