

Ajaxで検査した結果を表示したいのですが、サーバーからの結果からさらにJavaScriptの`switch`文の条件を当てはめたいのですが、その`switch`文は`done`の中に書くのでしょうか？  
どのようにしてサーバからの結果と`switch`文をつなげるのか分からないです。

**ソースコード**

[code]

    $(function(){
        // ajax button click
        $('#ajax').on('click',function(){
            $.ajax({
                url:'/home',
                type:'GET',
                data:{ 
                }
            })
         // ajaxリクエストが成功した時発動
            .done( (data) => {
                console.log("成功");
                console.log("formList:" + data);
                $('result').html(data);
                console.log(data);
            })
            .fail( (data) => {
          });
        });
    });
    
[/code]


CC BY-SA 4.0
2019-09-30T03:58:10.487
59349
2020-09-10T07:23:39.240
2020-09-10T07:23:39.240
32986
35696
question
javascript jquery ajax
Ajax の結果を用いた条件分岐は done の中に書けば良い？


はい、doneの中に書きます。  
doneに渡した処理は、ajaxリクエストが成功した時、  
failに渡した処理は、ajaxリクエストが失敗した時、  
alwaysに渡した処理は、ajaxリクエストが成功しても失敗しても実行されます。  
ajaxの場合、dataにレスポンス内容が入っています。

[code]

        $.ajax({
                url: 'http://example.com/api/v1/event/?' + queryString,
                type: 'GET',
                dataType: 'jsonp',
                jsonp: 'callback'
            })
            .done((data, textStatus, xhr) => {
                // success
                // 例えば、サーバが下記のような文字列を返す時
                // {
                //     "fooBars": [
                //         { "id": 1, "name":"alice" },
                //         { "id": 2, "name":"bob" }
                //     ]
                // }
                let name = data.fooBars[0].name; // alice
            })
            .fail((xhr, textStatus, errorThrown) => {
                // error
            })
            .always((arg1, textStatus, arg3) => {
                // complete
            });
    
[/code]

補足

  1. Ajaxはxhr規格のヘルパー関数です。
  2. リンク押下とxhrの違いは、細かい差異を除けば、ブラウザが読み直すか、js上で受け取るかだけです。
  3. xhrのhttpレスポンスbodyは、htmlの代わりにjson文字列などを返します。
  4. 歴史的な理由でxhrという名称ですが、通常はxml形式ではなくjson形式で返します。
  5. うまく値がサーバから帰ってこない場合は、jsonp、CORS辺りが原因かもしれません。


CC BY-SA 4.0
2019-09-30T08:13:53.927
59355
2019-09-30T08:13:53.927
25396
59349
answer