非同期通信が苦手だったが少しできたかもしれない。Ajax(jquery),PHP(fuelphp),MYSQL

非同期通信をするには、

Ajax

jquery使えば良いんだな。でもやりかた全然わかんない。

php

fuelphpでどんなしてやるんだ? ajaxでpostされたデータをcontrollerで受けっとて、modelでデータベースに格納する必要がある。 そして、渡したデータをjsonjqueryに返す必要がありそう。

mysql

modelでどうやってデータを挿入しようか。 formのinputにidをつけて、jqueryでval()で入力された値をとってこよう。

送信ボタンがクリックされたら、jqueryのクリックイベントを発火させて、ajax通信でcontrollerのurlにpostする。

$('要素').on('click',function(){
          $.ajax({
                  //post先のURL
                  url: '/controller/action名',
                  type: 'POST',
                  //何のデータを送るか、僕の場合、ユーザーがformに入力した内容を送る
                  data: {
                      name:  要素.val(),                
                      など..,
                  dataType: 'json'
           });
          .done(function(data, dataType){
            //成功時の処理をここに書く
   // 僕の場合はhtmlに埋め込むコードを書いた.例(要素).prepend(~data['name'] data['comment']~)
           })
          .fail(jqXHR, textStatus, errorThrown) => {
             alert('通信に失敗しました。');
             //失敗時の処理を書く
         });
});

fuelphpのcontroller側

public function action_post()
{
  if (Input::method() == 'POST') {
    $post = Input::post();
    //⬇︎モデルのメソッド、これでDBにinsertする。
    Model_Shop::insert_data($post);
 //渡した値をjsonでjquery側にjsonで返す。
    echo json_encode($post);
  }
}

丸2日くらいかかっちゃった。 だんだんとできないことに焦っていた。 どこでエラーが出てるのか、ajaxができていないのか、コントローラ側のphp側がおかしいのか、 デバッグしながら進めていくことが大切。