tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:RemoteActionとjQueryの$.ajaxの組み合わせを試してみました

あまり必要にならない気がしますが、jQueryの$.ajaxをつかってRemoteActionの非同期処理を実行できるのか試してみました。

呼び出し側
$j("#submitBtn").click(function() {
        $j.ajax( remoteActionGetText1() ).then(function(data) {
            //$j("<div>").text(data).appendTo("#target");
            console.log(data);
        })
        .then(wait)
        .then(function() {
          return $j.ajax(remoteActionGetText2());
        })
        .then(function(data) {
            //$j("<div>").text(data).appendTo("#target");
        })
        return false;
    });
});
RemoteActionの処理
function remoteActionGetText1() {
    var defer = $j.Deferred();
    jQueryDeferredDemoController.getText1(
        function(result, event){
            if (event.status) {
                console.log('-- $j.Deferred() : remoteActionGetText1 --');
                console.log(result);
                defer.resolve(result);
            } else {
                console.log('-- [ERROR] : remoteActionGetText1 --');
                defer.reject(event);
            }
        },
        { buffer: true, escape: true, timeout: 30000 }
    );
    
    return defer.promise;
}


コンパイルエラーにはならなかったので書き方はこんな感じだと思います。実行順序はどうかなと確認してみるととりあえず大丈夫そうに見えました。
f:id:tyoshikawa1106:20160407114707p:plain


それでは..とdefer.resolve(result);の結果を確認してみると・・・HTMLタグが文字列として返ってきていました。(処理順序もうまく制御できていなかった。。)
f:id:tyoshikawa1106:20160407115031p:plain


書き方がよくないのかもしれませんが、今回試してみた結果はこんな感じです。今のところこの組み合わせが必要になったことはないのですが、いつかうまくいくやり方を覚えたら、追記しようと思います。

おまけ

Angular.jsの非同期処理のサンプルが紹介されている記事がありました。

Using AngularJS with VisualForce Remoting | Force.com Learning

サンプルコード