質問: Ajaxで検査した結果を表示したいのですが、サーバーからの結果からさらにJavaScriptの`switch`文の条件を当てはめたいのですが、その`switch`文は`done`の中に書くのでしょうか? どのようにしてサーバからの結果と`switch`文をつなげるのか分からないです。 **ソースコード** ``` $(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) => { }); }); }); ```
回答: はい、doneの中に書きます。 doneに渡した処理は、ajaxリクエストが成功した時、 failに渡した処理は、ajaxリクエストが失敗した時、 alwaysに渡した処理は、ajaxリクエストが成功しても失敗しても実行されます。 ajaxの場合、dataにレスポンス内容が入っています。 ``` $.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 }); ``` 補足 1. Ajaxはxhr規格のヘルパー関数です。 2. リンク押下とxhrの違いは、細かい差異を除けば、ブラウザが読み直すか、js上で受け取るかだけです。 3. xhrのhttpレスポンスbodyは、htmlの代わりにjson文字列などを返します。 4. 歴史的な理由でxhrという名称ですが、通常はxml形式ではなくjson形式で返します。 5. うまく値がサーバから帰ってこない場合は、jsonp、CORS辺りが原因かもしれません。