function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Shiva RajendranShiva Rajendran 

Unexpected behaviour in Accessing controller variable in javascript in salesforce

Hello ,

I have a controller  with one variable in it.When the command button is clicked . js function is called which alert the apex controller variable. The command button increments the variable of apex, but the js always alerts the value set in the apex controller constructor value. No idea why? Do i miss any basic feature of salesforce inregard with accessing variable of apex in js?

Vf page :
  
<apex:page controller="ReRenderIssueController_CC">
    <script>
    function clickButton()
    {
        var s="{!JSENCODE(Stringii)}";
        alert("hello "+{!Stringii} +"  " +{!ii});
        alert(s);
        }
    </script>
    <apex:form>
    <apex:outputPanel id="iiComp">
    {!ii}
       </apex:outputPanel> 
        <apex:commandButton onclick="clickButton();" value="Save" action="{!save}" reRender="iiComp" title="click to reRender"/>
    
    </apex:form>
</apex:page>



Controller 
  
public class ReRenderIssueController_CC {
    public integer ii{get;set;}
    public String Stringii{set;}
    
    public String getStringii()
    {
        return String.valueOf(ii);
        
    }
    
    public ReRenderIssueController_CC()
    {
        ii=2;
        
    }
    
    public pageReference save()
    {
        ii++;
        return null;
           
    }
    
}
I always get value 2,2 in js while the vf page gets changed to 2,3 and so on, based on user click on the button.

Any help will be welcomed.

Thanks and Regards,
Shiva RV

 
Kalpesh Vyas 14Kalpesh Vyas 14
Hello Shiva,
It is because you are only rerendering the outputPanel
Here I have changed your code. 
<apex:page controller="ReRenderIssueController_CC">
   
    <apex:form >
    <apex:outputPanel id="iiComp">
    {!ii}
         <script>
    function clickButton()
    {
        var s="{!JSENCODE(Stringii)}";
        alert("hello "+{!Stringii} +"  " +{!ii});
        alert(s);
        }
    </script>
       </apex:outputPanel> 
        <apex:commandButton onclick="clickButton();" value="Save" action="{!save}" reRender="iiComp" title="click to reRender"/>

    </apex:form>
    
</apex:page>

 
Shiva RajendranShiva Rajendran
Hi Kalpesh,

It worked thanks :) But could you explain how it actually works?
I mean what if i had the js function is present in the static resouce js file.
In that case ,how to solve this problem?

Thanks and Regards,
Shiva RV
Kalpesh Vyas 14Kalpesh Vyas 14

Hi Shiva,
Simple concept is that whatever we rerender that portion only gets refreshed from server. As here we are refreshing "iiComp" only. And please mark this question as resolved.
Shiva RajendranShiva Rajendran
Hi Kalpesh,
So this code can't be handled if the js code is written in static resource?

Thanks and Regards,
Shiva RV
Kalpesh Vyas 14Kalpesh Vyas 14
Of course not.
I think you should study more on basics.
Thank you!!