質問: 現在、Geolocationで位置情報とテキストを入力したデータをajaxでjsonに送信するWebアプリの機能を製作しています。ajaxによるjsonデータの通信部分にも自信があると言えず、今のコードでは無反応状態です。ajaxによる入力データの取得とPOST送信の部分に助言があればお願いします。 以下コード ``` DEMO タイトル コメント 送信 Map output ```
回答: まず、clickをバインドしていますが、グローバルに直書きだとDOMの準備が出来ていないためバインドできません。 `DOMContentLoaded`の中に入れましょう。 これでまずクリックイベントが走るようになるはずです。 あと`ajax`へ`data`を`post`する際にJSON文字列にしているのには意味があるのでしょうか? 下記のようにすればObjectをそのまま渡せます。 あと通信エラーの判別の引数がないとエラー時に対処に困ります。 試験中はつけておいたほうがいいかと思います。 ``` //通信実行 $.ajax({ type: "post", url: "/path/to/post", data: data, dataType: "json", success: function (json_data) { if (!json_data[0]) { alret("処理的なエラー" + json_data[1]); return; } location.reload(); }, error: function (XMLHttpRequest, textStatus, errorThrown) { console.log(XMLHttpRequest); console.log(textStatus); console.log(errorThrown); alert("サーバーエラーです。もう一度再試行してください"); }, complete: function () { button.attr("disabled", false); } }); ``` 問題の切り分けとして、まずどこまでコードが走っているか調査すべきです。 今回の場合、 1.クリックイベントが走っているか? 2.通信できているか? 3.通信のパラメータは正しいか? と調査できるはずですので、 consoleを置くなどして調査しましょう。