How to replace Controller Variables with javascript variables on visual force page?

Salesforce Asked by Vinay Chanchlani on November 23, 2021

I’ve an apex page that is using controller variables for rendering data via apex tags on visualforce page, But this variable increases view state size so I want to replace it with javascript variable and make the controller variable transient.

My code snippet is as following :

<apex:repeat value="{!allObjectPermissionMap[st.sourceTargetId]}" var="sol">
                                    <apex:repeat value="{!sol}" var="so">
                                    <tr>
                                        <td><apex:inputCheckbox styleClass="objPerm--{!st.sourceTargetId}" onchange="toggleItem('objPerm', 'objPerm--{!st.sourceTargetId}');" value="{!so.isSelected}" disabled="{!so.targetObjPermissions = null}"></apex:inputCheckbox></td>
                                        <td>{!so.objName}</td>
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.allowRead}"/></td>
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.allowCreate}"/></td>   
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.allowEdit}"/></td>
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.allowDelete}"/></td>
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.viewAllRecords}"/></td>
                                        <td><c:profilepermissionviewer OK="{!so.sourceObjPermissions.modifyAllRecords}"/></td>

                                        <apex:outputPanel rendered="{!so.targetObjPermissions != null}">
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.allowRead}"/></td>
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.allowCreate}"/></td>   
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.allowEdit}"/></td>
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.allowDelete}"/></td>
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.viewAllRecords}"/></td>
                                            <td><c:profilepermissionviewer OK="{!so.targetObjPermissions.modifyAllRecords}"/></td>
                                        </apex:outputPanel>

                                        <apex:outputPanel rendered="{!so.targetObjPermissions = null}">
                                            <td><label>{!$Label.NA}</label></td>
                                            <td><label>{!$Label.NA}</label></td>
                                            <td><label>{!$Label.NA}</label></td>
                                            <td><label>{!$Label.NA}</label></td>
                                            <td><label>{!$Label.NA}</label></td>
                                            <td><label>{!$Label.NA}</label></td>
                                        </apex:outputPanel>
                                    </tr>   
                                </apex:repeat>

All I want to do is to replace ‘allObjectPermissionMap’ variable with javascript variable and rest of the code remains same. Is there any way I can do this?

apex community visualforce

One Answer

You should be able to serialize the Map and retrieve it in Javascript like this:

In your controller define a getter that retrieves the Map as a JSON string:

public transient Map <Id, SomeSObject> sObjectMap     {get;set;}
public transient String                sObjectJSON    {get{return JSON.serialize(sObjectMap);}}

To access the Map in Javascript, you can instantiate as the page loads like this:

<script type="text/javascript">  
    var previousOnload = window.onload;        
    window.onload = function() { 
        if (previousOnload) { 
        previousOnload();
    }
    //your object can be accessed using array or object dot notation in Javascript now
    var obj = JSON.parse('{!sObjectJSON}');
  }               
</script>

Answered by Caspar Harmer on November 23, 2021

Add your own answers!

Ask a Question

Get help from others!