Ajaxで、PHPから一つのデータを受け取る場合と、複数のデータを受け取る場合との違いです。
一つのデータを受け取る場合
PHP側
function function_ajax(){
$id = $_POST['post_id'];//jsから受け取ったデータ
//処理を記述
$return = 'jsに渡したい文字列など';
echo $return;
die();
}JS側
$.ajax({
type: 'POST',
url: ajaxurl,
data: {
'action' : 'function_ajax',
'post_id' : セレクタ名.text(),
},
success: function(data){
セレクタ名.html(data);
}
});※PHPから受け取ったデータを表示しています。（「セレクタ名.html(data)」の箇所）
※ajaxurlは定義済みです。
※「post_id」はPHP側に渡す変数名です。
複数のデータを受け取る場合
PHP側
function function_ajax(){
$id = $_POST['post_id'];//jsから受け取ったデータ
//処理を記述
$data = array();
$data['html'] = "jsに渡したい文字列など";
$data['message'] = 'jsに渡したい文字列など';
header("Content-type: application/json; charset=UTF-8");
echo json_encode($data);
die();
}ポイント
ポイントは以下の2行です。
header("Content-type: application/json; charset=UTF-8");
echo json_encode($data);
Content-TypeがJSONのheaderを付け、エンコードしてjs側に渡します。
JS側
$.ajax({
type: 'POST',
url: ajaxurl,
data: {
'action' : 'function_ajax',
'post_id' : セレクタ名.text(),
},
success: function(data){
if(data.html){
セレクタ名.html(data.html);
}
alert(data.message);
}
});PHPから受け取ったデータ「data」は「data.〇〇」で取り出します。
上記例では「data.html」に何等かの値が入っていれば表示、「data.message」はアラート表示しています。
コメントを残す