jQueryとPHPでAJAX通信を行う処理について

jQueryの$.ajaxでデータをphp側に渡し、phpの方で処理をしたあと再度jQueryで受け取る処理についてです。

例として、ボタンをクリックするとインプット欄の日付を取得してphpに渡し、phpは渡された日付のデータをjQuery側に返すというプログラムです。

jQuery

<input type='date' name='date'>
<button>ボタン</button>
<script>
jQuery(function($){
  $('button').click(function(){
    var day = $('input[name=date]').val();//インプット欄の日付を取得
    
    $.ajax({
      type: 'POST',
      dataType:'json',
      url:'api.php',
      data:{
        item:day
      },
      success:function(data) {
        alert(data);
      },
      error:function(XMLHttpRequest, textStatus, errorThrown) {
      
      }
    });
});
</script>

PHP
<?php
  $day = $_POST['item'];//ポストで受け取れる
  //略
  $html = "戻り値";
  
  header('Content-type: application/json');//指定されたデータタイプに応じたヘッダーを出力する
  echo json_encode( $html );

ajax通信を行うjQueryのメソッドは他に$.load、$.get、$.post、$.getJSON、$.getScriptが存在し、目的によってはこれらを使った方がシンプルになる。最も多機能で多くのことができるのは$.ajaxのようです。$.loadや$.getなどで出来ることで$.ajaxにできないことはなく、$.ajaxで可能なことの多くを$.loadや$.getではできません。

$.ajaxでのPHPへのデータの渡し方ですが、data:{day:day}の部分で指定しています。オブジェクトでデータを渡すと、プロパティがPHPが受け取る配列のキーとなるわけです。data:{foo:'引数'}なら、PHP側は$_POST[‘foo’]で’引数’を受け取ることになります。

dataTypeはこ他にもxml、html、script、jsonp、textが利用でき。PHP側で出力させたい内容に応じて変えます。

dataTypeにjsonを指定した場合、PHPで出力する際はheader('Content-type: application/json');を書いてからjson_encode()を通したものをprintトします。ここでprintしたものが$.ajaxのsuccess:function(data){}に渡されます。

受け取ったデータの処理はsuccess:function(data){}内に書き、ajax通信に失敗した際の処理はerror:function(XMLHttpRequest, status, errorThrown){}に書きます。