Menggunakan jQuery untuk menghapus data yang disimpan di wp_options

Saya ingin tahu apakah ada yang bisa menasihati saya lebih lanjut tentang masalah saya. Bagian dari plugin saya menyimpan file log untuk keperluan debugging. Saya telah berhasil menampilkannya dalam (div # log) di halaman admin saya menggunakan jquery dan wp_localise_script. Saya memiliki tombol untuk menghapus log ini, tetapi saya tidak yakin bagaimana memprosesnya. Saya merasa bahwa ajax mungkin berguna di sini tetapi tidak yakin harus mulai dari mana.

Inilah bagian yang relevan dari kode saya:

admin_enqueue_scripts (aksi)

 $args = array(get_option('wow_tweets_log'));//log files fetched from wp_options table    
    wp_enqueue_script('wow_tweet');//registered earlier on with jQuery dependency
    wp_localize_script('wow_tweet', 'wow_vars', $args);

Halaman Admin

<tr><th scope="row"><strong>Debugging</strong></th><td>
    <div id="debug" class="button-primary">Debug</div><!--debug button shows logs-->
    <div id="hide_debug" class="button-secondary">Hide</div><!--debug button hides logs-->
    <div id="clear_log" class="button-secondary">Empty Log</div><!--Press to delete logs-->
</td></tr>
<tr><th scope="row"></th><td><div id="log"><!--Logs show here--></div></td></tr>

Javascript

jQuery(document).ready(function() { 

    var debug_show = jQuery('#log').hide();//hides log by default

    jQuery('#debug').click(function(){//on click shows logs files in div#log
        for (var i = 0, l = wow_vars.length; i < l; i++) {
            var data = wow_vars[i];
        }
        jQuery('#log').show().html(data);

    });
    jQuery('#hide_debug').click(function()
    {
        debug_show.hide();
    }); 
});

Tindakan menghapus log

 function clear_log(){
    delete_option('wow_tweets_log');//am stuck on how to invoke this

    /*die();  would go at the end if ajax used*/
 }
 add_action('clear_log','clear_log');

Sejauh ini skrip ini berfungsi untuk menampilkan semua file log, sekarang yang saya butuhkan adalah menghapusnya ketika mengklik #clear_log. Saya tahu memasukkan do_action pada init akan menghapusnya segera setelah halaman dibuka, membuat javascript saya tidak berguna jadi saya kira satu-satunya pilihan adalah ajax! Apakah saya perlu menambahkan referensi lain ke wp_localize_script ()? Bantuan apa pun akan dihargai.

Ajax di WordPress berfungsi dengan mengirim pos HTTP ke /wp-admin/admin-ajax.php (secara default) yang kemudian mengaktifkan pengait yang sesuai. Jadi, Anda melampirkan beberapa jquery ke acara yang dipicu oleh tombol hapus Anda, yang kemudian mengeposkan ke admin-ajax.php, yang memiliki tindakan, misalnya, delete_my_options (), yang sebenarnya menjalankan php untuk dihapus. Kemudian, Anda memiliki fungsi, yang disebut callback, yang berjalan setelah berhasil menyelesaikan permintaan ajax. Anda bisa menggunakan ini untuk memudar div #log Anda misalnya.

Singkatnya, Anda memiliki tiga langkah, tindakan, ajax dan panggilan balik. Tindakan dipicu oleh peristiwa DOM dan dilampirkan ke dua kait, wp_ajax_ {action_name} dan wp_ajax_nopriv_ {action_name} (hanya jika Anda ingin tidak ada pengguna login yang dapat melakukannya). Ini menyala ketika tindakan itu diposting ke wp-admin / admin-ajax.php. Ajax adalah fungsi php (biasanya) yang terhubung dengan mereka. Fungsi panggilan balik adalah fungsi javascript yang diaktifkan ketika ajax berhasil diselesaikan.

Selangkah demi selangkah:

Langkah 1, di file js Anda

jQuery('#hide_debug').click(function()
{
    var data = {};
    data.action = 'clear_log_action';
    data.options_delete_nonce = ajax_object.options_delete_nonce;
    jQuery.post(ajax_object.ajax_url, data, clear_log_callback);

}); 

Langkah 2, di functions.php Anda atau sebuah plugin

Tambahkan ini ke fungsi yang Anda gunakan untuk javascript: (terima kasih @Milo)

wp_localize_script( 'my_js_file_name', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ,   'options_delete_nonce' => wp_create_nonce( 'options_delete_nonce' ), ) );

Kemudian tambahkan ini ke functions.php atau plugin Anda:

// Edit: removed the nopriv hook (Thanks @toscho)
add_action('wp_ajax_clear_log_action','clear_log_ajax'); // attach your data.action to wp_ajax and wp_ajax_nopriv and hook your php function
function clear_log_ajax() {
    $nonce = $_POST['options_delete_nonce'];
    // Edit: Added nonces and permissions check (Thanks @Otto)
    if( wp_verify_nonce( $nonce, 'options_delete_nonce' ) && current_user_can( 'manage_options' ) ) {
        delete_option('wow_tweets_log');
        die(); // make sure to put a die() or exit() at the end of your ajax
    }
}

Langkah 3, kembali ke file js Anda

// output will be what is echoed from your ajax, if anything
function clear_log_callback(output) 
{
    jQuery('#log').hide();
}