+ Start a Discussion
nimdharnimdhar 

Getting null when trying to access using DOM

Hi,
  I am not able to understand why the below code is giving the Id correct  for the  first alert box and  giving null when trying to access using DOM.

<apex:page StandardController="Account">

<script>
function twistsections(id)
{
alert(id);
alert(document.getElementById(id));
document.getElementById(id).style.display="none";
}
</script>
<apex:form>
<apex:pageBlock title="Customer Information" id="block" mode="edit">
<apex:pageBlockSection title="Account Information" id="sample"   onclick="twistsections('{!$component.block.sample}');">
<apex:inputField id="accountName" value="{!account.Name}" />
<apex:inputField id="accountSite" value="{!account.Site}"/>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</apex:page>

Thanks,
nimdhar
dchasmandchasman
There are a few ways to go to get the dom id in this specific situation:

<apex:pageBlockSection title="Account Information" id="sample" onclick="twistsections('{!$component.this}');">

or

<apex:pageBlockSection title="Account Information" id="sample" onclick="twistsections(this.id);">

or

<apex:pageBlockSection title="Account Information" id="sample"   onclick="twistsections('{!$component.sample}');">


nimdharnimdhar
Hi Doug,

Thanks for responding. I tried all the three ways but the result is null.

Thanks,
Sravani
dchasmandchasman
Yes I realized that you have encountered an issue specific to <apex:pageBlockSection> that has already been fixed in Summer '08 (no plans to backport the fix at this time).
nimdharnimdhar
Okay. Thank you.