I've embedded two of my visualforce pages in a single visualforce page using apex:include. If I access an element value from one of the vf pages independently, I'm able to get it. But when I try to access it in the child vf page, it returns null.

Master VF Page:

<apex:page docType="html-5.0" id = "includePage">
  <apex:sectionHeader title="MASTER PAGE"/>
  <apex:tabPanel switchType="client">
    <apex:tab label="Page1" style="width:150px;" id="tabId1">
      <apex:include pageName="TestPage1" id="pageId1"/>
    <apex:tab label="Page2" style="width:150px;"  id="tabId1">
      <apex:include pageName="TestPage2" id="pageId2"/>

Child VF Page:

<apex:page controller="ControllerForTest" id="pageForAccount" docType="html-5.0" >
  <apex:form id="formForAccount">
  <apex:pageBlock title="Accounts" id="accountsPanel">
    <apex:selectList value="{!selectOptionValueForAccount}" size="1" multiselect="false" id="optionForAccId">
                    <apex:selectOption itemValue="" itemLabel="--None--"/>
                    <apex:selectOption itemValue="One" itemLabel="One"/>
                    <apex:selectOption itemValue="Two" itemLabel="Two"/>
   <apex:commandButton value="Save" onclick="checkSelectedValue();"/> 
  function checkSelectedValue() {
    var EleForPage = document.getElementById('includePage:tabId1:pageId1:pageForAccount:formForAccount:accountsPanel:optionForAccId');
    alert(EleForPage); //This returns null

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.