function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
hk7965hk7965 

JavaScript Error - Error: document.getElementById(...) is null


Hi ,

I have embeded a JS function in VF to validate mandatory fields. But its not working as expected and getting JS error-  document.getElementById(...) is null when i click Submit button.  please help me to fix this issue.




function commentsrequired(csc,csr)
    {

    var x=document.getElementById(csc).value;

         var y=document.getElementById(csr).value;

    if(x==null&y==null)

        alert("please fill mandatory fields");

        else
         return true;
        acsave();
    }
          if({!surveyreceived} || {!stateopen})
          {
             window.location = "../apex/NoFeedBackRequired";
          }
      </script>
     <apex:pageBlock id="survey">
    
          <apex:pageBlockSection title="Survey Details" columns="2" >

          <apex:inputField label="Rating<br></br><h0>(5-Excellent; 4-Good;
3-Average; 2-Poor; 1-Very Poor)</h0>"
value="{!Survey__c.Service_Ratings__c}" id="csr"/>
          <apex:tabPanel ></apex:tabPanel>
          <apex:inputField label="Please provide your overall comments
about the service provided." value="{!Survey__c.Comments__c}"
required="true" id="csc"/>

          </apex:pageBlockSection>
          <br></br><br></br>
          <apex:actionFunction name="acsave" action="{!save}"
oncomplete="alert('Done');" />
          <apex:actionFunction name="acreopen" action="{!reopen}"
oncomplete="alert('Incident has been reopened successfully'); " />


              <input type="button"
onclick="commentsrequired('{!$Component.csc}','{!$Component.csr}')" name="Submit"
value="Submit"/>
              <input id="acreopen1" type="button"
onclick="disablebutton();acreopen();" name="Reopen" value="Reopen"/>

         </apex:pageBlock>

    </apex:form>
    <script>
    function disablebutton()
    {
        //alert(document.getElementById('acreopen1'));
        document.getElementById('acreopen1').disabled = true;
    }
    </script>

Regards
Mohan Krishna
Best Answer chosen by hk7965
kevin lamkevin lam
It's because both csc and csr are within the Survey Details pageBlockSection, you need to update that pageBlockSection with an id attribute (e.g. id="sectionid") and then update your button as follows:

onclick="commentsrequired('{!$Component.sectionid.csc}','{!$Component.sectionid.csr}')"

All Answers

nbknbk
check the below link which is similar one.
https://developer.salesforce.com/forums/ForumsMain?id=906F000000094JIIAY

alternatively Please put the alerts after this statement var x=document.getElementById(csc).value; and check view source to get the exact id's in the form.
kevin lamkevin lam
It's because both csc and csr are within the Survey Details pageBlockSection, you need to update that pageBlockSection with an id attribute (e.g. id="sectionid") and then update your button as follows:

onclick="commentsrequired('{!$Component.sectionid.csc}','{!$Component.sectionid.csr}')"
This was selected as the best answer
hk7965hk7965
Thanks Kevin. That did the Trick. 


Regards
Mohan Krishna