### 2. JavaScriptコード ( script.js )

jQuery(document).ready(function($) {
// データを追加
$(‘#add-data’).click(function() {
console.log(“add-data”);
var data = $(‘#data-input’).val();
if (!data) {
alert(‘データを入力してください。’);
return; // データが空の場合は処理を中止
}
console.log(my_custom_plugin_ajax.ajax_url);

$.post(my_custom_plugin_ajax.ajax_url, {
action: ‘add_data’,
data: data
}, function(response) {
// 成功時の処理
if (response.success) {
alert(‘データが追加されました’);
$(‘#data-input’).val(”); // 入力フィールドをクリア
} else {
alert(‘データの追加に失敗しました: ‘ + response.data);
}
}).fail(function(jqXHR, textStatus, errorThrown) {
console.error(‘AJAXエラー:’, textStatus, errorThrown);
alert(‘AJAXリクエストに失敗しました。’);
});
});

// データを取得
$(‘#get-data’).click(function() {
$.post(my_custom_plugin_ajax.ajax_url, {
action: ‘get_data’
}, function(response) {
if (response.success) {
var output = ”;
response.data.forEach(function(item) {
output += ‘

‘ + item.data + ‘

‘;
});
$(‘#data-output’).html(output);
}
});
});

// データを削除
$(document).on(‘click’, ‘.delete-data’, function() {
var id = $(this).data(‘id’);
$.post(my_custom_plugin_ajax.ajax_url, {
action: ‘delete_data’,
id: id
}, function(response) {
if (response.success) {
alert(‘データが削除されました’);
$(‘#get-data’).click(); // データを再取得
}
});
});
});

タイトルとURLをコピーしました