How to call JavaScript from Apex Class

Feedback

In today post we will see how to call JavaScript method from apex class, if you remember in some of my earlier post we have seen how to call the apex class method and refer apex class variable through JavaScript, In earlier post we also discussed how to pass the visualforce variables values to the apex class methods via JavaScript and jQuery Remoting but today we will see completely different thing, i came across a situation where i want to execute JavaScript method when certain conditions are met in apex , the situation was that if I get an error then reload the browser after 7 seconds , i think this is not possible with apex so i decide to call JavaScript method from apex class and after little research over Google i found a solution which works perfectly so i think to share it with other guys over my blog so everyone can get help ,so let’s see how it work.

Calling JavaScript Method from Apex

I have created a apex class and a visualforce page and in my apex class i have created one method that going to be executed or call on a button click from a visualforce page and in that method i am calling JavaScript Method but there is no way to directly call JavaScript so for that we need to create a getter and setter variable and that variable will hold the call the call to JavaScript and that variable is a getter and setter variable so the value of that variable can be refereed in the visualforce page, to understand it more clearly please see the below example.

<apex:page showHeader="true" sidebar="true" controller="Controllertojavascriptcontroller">
<script>
  function func()
  {
  alert('function called');
  window.setTimeout(function(){ window.location.reload(); }, 7000);
  }
  </script>

  <apex:form>
    <apex:pageBlock title="just page block"  >
    <apex:pageBlockButtons title="button title" location="bottom">
        <apex:commandButton value='call controller' action="{!func}" >
        </apex:commandButton>
    </apex:pageBlockButtons>
        <apex:outputText value="{!scriptvar}" escape="false">
        </apex:outputText>
    </apex:pageBlock>
  </apex:form>
</apex:page>

The above one is the visualforce page code now let’s see the code for the apex class, see below.

public with sharing class Controllertojavascriptcontroller {
	public String Name {get; set;}
	public string scriptvar{get;set;}
	public Controllertojavascriptcontroller() {
			Name='Sudhir Dudeja';
	}
	public void func(){
		//We would call javascript from here this apex function
		scriptvar='<script> func(); </script>';
	}
}

Now let see what actually above codes are doing so let’s look to the apex class code, At 3rd line i created a getter and setter variable called scriptvar which is going to be hold the call to JavaScript so when apex function/method get called the code from the visualforce button then it would hold a JavaScript call like

scriptvar='<script> func(); </script>';

Now visualforce page that is referring scriptvar variable is the outputtext tag at line 16th in visualforce page code and this tag also have one attribute Escape, this attribute going to be decide how should scriptvar variable will going to look or behave in browser specially when if a variable contains the HTML tags like angular brackets, to understand more about this attribute take a look down below description.

What is escape attribute in salesforce

Consider you have declared string variable and that string variable hold some HTML tags like angular brackets so when you use escape attribute then that would change the code and tell your browser that’s it not a HTML tags, so in our case we have marked the escape as false so whenever button is get called the value of variable get set and it would then execute the JavaScript function from apex.
I hope you like my this post and if you have any query then leave a comment below in the comment section i will try help you and don’t forget to subscribe to my blog and social networking pages and also you can look at some below related post.

Related Articles :

Speak Your Mind

*