Not able to send heavy data as json/string from Apex Class to visualforce page from Apex class properties

Question

I have a situation where I am using <apex:actionFunction> oncomplete attribute to call a JS function and i am sending some data as parameters but this data is very heavy, having around 90,000 characters and I am not able to pass it as parameter in actionFunction's oncomplete, actually the JS functin on oncomplete is not getting called.

My actionFunction :

<apex:actionFunction name="GetAllData" action="{!GetDataController}" reRender="none" oncomplete="GetProjectCompleted('{!data1}')">
    <apex:param id="userAndDomainProj" name="userAndDomainProj" value="" />
</apex:actionFunction>

The data I am trying to get from Apex Class is {!data1}. If data1 has small data I am able to fetch it easily and if data is large I am not even able to call function.

What can be the solution.

Is there anty other way to send this heavy data from Apex class to visualforce page.

Answer 1

I was able to get the desired behavior with "small data" by creating the sample page below:

<apex:page controller="testPageController" doctype="html-5.0">
    <apex:form id="none">
        <apex:actionFunction name="actionFunction" action="{!doIt}" reRender="none" oncomplete="alert('{!data}')">
            <apex:param name="param" value=""/>
        </apex:actionFunction>
    </apex:form>
    <script>
    actionFunction('hello world!');
    </script>
</apex:page>

Controller:

public class testPageController {
    public String data {get; set;}

    public testPageController() {
        this.data = '';
    }

    public void doIt() {
        String param = ApexPages.currentPage().getParameters().get('param');
        system.debug(param);
        this.data = param;
    }
}

To be honest I'm surprised this even works because if you view the source of the page this is what the action function looks like:

<script id="j_id0:none:j_id1" type="text/javascript">
    actionFunction=function(param){
        A4J.AJAX.Submit(
            'j_id0:none',
            null,
            {
                'similarityGroupingId':'j_id0:none:j_id1',
                'oncomplete':function(request,event,data){
                    alert('')
                },
                'parameters':{
                    'param':(typeof param!='undefined'&&param!=null)?param:'',
                    'j_id0:none:j_id1':'j_id0:none:j_id1'
                 } 
             } 
         )
     };
</script>

Notice the alert has an empty string parameter. The fact that my page can actually alert the "hello world" even though that parameter renders as empty even after the form is re-rendered is what surprises me.

Anyway, since this works my only conclusion is the one I mentioned in the comments. there must be something in the string that is causing a syntax error. This is verified by the fact that you said when you copy/paste the debug into the script and run it you get errors.

I was also able to replicate your issue where there are no developer console errors by manually setting the value of data to '\'test' in the apex code:

 public void doIt() {
    this.data = '\'test';
}

doing this actually allows the HTML to render the attribute:

alert(''test')

In which there is the very obvious syntax error, but this does not throw any developer console errors for a reason I can't ascertain.

Conclusion

Something in {!data1} is causing a syntax error.