+ Start a Discussion
DeepVDeepV 

how to show error message display on visual force using javascript

Hi All,

I'm trying to show an error message near the email field on visualforce page. Can I use ouputtext and innerhtml to display message?
Here is my code:

<apex:page id="thepage" controller="mySurvey">pt>
    <script type="text/javascript">
        var examNote = document.getElementsByClassName('examNote')[0].value;
        var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i;
        var validEmail = re.test(examNote);
             if(validEmail == false) {
             alert("email not valid"); //checking if the code is reaching here by an alert message
             //code to show the error message on vf page instead of alert
            
     </script>
    <apex:form id="audit">
        <apex:pageblock id="pb1" >
          <apex:pageblockSection id="pbs1" columns="1">
            <p><apex:inputText value="{!account}" label="Account"/></p>
            <apex:inputText id="Survey" value="{!txtSurvey}" label="SurveyName"/>
            <apex:inputText id="examNote" value="{!examNote}" Label="Exam Note" styleClass="examNote"/>
            <apex:outputText value="{0}">
                <apex:param value="result"/>
            </apex:outputText>
              <apex:commandButton action="{!save}" onclick="return validate();" value="save"/>
          </apex:pageblockSection>
        </apex:pageblock>
    </apex:form>
</apex:page>
Amit Chaudhary 8Amit Chaudhary 8
Please update your code like below
<apex:page id="thepage" controller="mySurvey">pt>
    <script type="text/javascript">
        var examNote = document.getElementsByClassName('examNote')[0].value;
        var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/i;
        var validEmail = re.test(examNote);
            if(validEmail == false) 
			{
				document.getElementById("demo").innerHTML = 'email not valid';
				document.getElementById("demo").style.color = 'red';
			} 	
			 
     </script>
	 
    <apex:form id="audit">
		<p id="demo"></p>
        <apex:pageblock id="pb1" >
          <apex:pageblockSection id="pbs1" columns="1">
            <p><apex:inputText value="{!account}" label="Account"/></p>
            <apex:inputText id="Survey" value="{!txtSurvey}" label="SurveyName"/>
            <apex:inputText id="examNote" value="{!examNote}" Label="Exam Note" styleClass="examNote"/>
            <apex:outputText value="{0}">
                <apex:param value="result"/>
            </apex:outputText>
              <apex:commandButton action="{!save}" onclick="return validate();" value="save"/>
          </apex:pageblockSection>
        </apex:pageblock>
    </apex:form>
</apex:page>

Let us know if this will help you
 
DeepVDeepV
Hi Amit,

I tried using your code, I not getting the javascript validation
DeepVDeepV
the field i'm using is an email field type, that may the reason?

I'm not getting the javascript validation instead getting a salesfroce validation email not valid