`client.ajax` does not work from within command buttons.

[Blackbaud-CraigPemberton]

There is a failure in client.ajax when called from a command button, but not when called directly or from an anchor.

<apex:page >
    <script src="//code.jquery.com/jquery-1.5.2.min.js"></script>
    <apex:includeScript value="{!$Resource.forcetk_js}"/>
    <script type="text/javascript">
        var reportId = '00Oo00000037Vzx'; // set to report on your system
        var client = new forcetk.Client();
        client.setSessionToken('{!$Api.Session_ID}');
        var path = 'v31.0/analytics/reports/' + reportId + '?includeDetails=true';
        function success(){ console.log('hooray'); }
        function failure(){ console.log('ohnoes'); }
        function go(){ client.ajax(path, success, failure); }
        go(); // hooray
    </script>
    <a onclick="go()" href="#">click anchor</a> // hooray
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockSection columns="1" >
                <apex:pageBlockSectionItem >
                    <apex:commandButton value="click command button" onclick="go()"/> // ohnoes
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

[metadaddy]

I had to tweak your sample a little to get it to work at all:

• use <script> tag consistently instead of mixing <script> and <apex:includeScript>
• path should start with a '/'

The behavior I saw was that the page was reloaded when I clicked the command button, causing client.ajax to never return. This is because the default behavior of the command button is to reload the page. You can stop this from happening by having the onclick handler return false.

This code works for me:

<apex:page >
    <script src="//code.jquery.com/jquery-1.5.2.min.js"></script>
    <script src="{!$Resource.forcetk}"/>
    <script type="text/javascript">
        var reportId = '00Oo00000037Vzx'; // set to report on your system
        var client = new forcetk.Client();
        client.setSessionToken('{!$Api.Session_ID}');
        var path = '/v31.0/analytics/reports/' + reportId + '?includeDetails=true';
        function success(){ console.log('hooray'); }
        function failure(){ console.log('ohnoes'); }
        function go(){ client.ajax(path, success, failure); }
        go(); // hooray
    </script>
    <a onclick="go()" href="#">click anchor</a> // hooray
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockSection columns="1" >
                <apex:pageBlockSectionItem >
                    <apex:commandButton value="click command button" onclick="go(); return false;"/> // ohnoes
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

[Blackbaud-DiHuynh]

That works for me. Thanks for the prompt response!