การใช้ jQuery เพื่อลบข้อมูลที่เก็บไว้ใน wp_options


10

ฉันสงสัยว่าใครสามารถให้คำแนะนำฉันเพิ่มเติมเกี่ยวกับปัญหาของฉัน ส่วนหนึ่งของปลั๊กอินของฉันเก็บไฟล์บันทึกสำหรับการดีบัก ฉันได้แสดงให้พวกเขาประสบความสำเร็จใน (div # log) ในหน้าผู้ดูแลระบบของฉันโดยใช้ jquery และ wp_localise_script ฉันมีปุ่มเพื่อลบบันทึกเหล่านี้ แต่ฉันไม่แน่ใจว่าจะดำเนินการอย่างไร ฉันมีความรู้สึกว่าอาแจ็กซ์อาจมีประโยชน์ที่นี่ แต่ไม่แน่ใจว่าจะเริ่มจากตรงไหน

นี่คือส่วนที่เกี่ยวข้องในรหัสของฉัน:

admin_enqueue_scripts (การกระทำ)

 $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);

หน้าผู้ดูแลระบบ

<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>

จาวาสคริ

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();
    }); 
});

การดำเนินการเพื่อล้างบันทึก

 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');

จนถึงตอนนี้สคริปต์นี้กำลังทำงานเพื่อแสดงไฟล์บันทึกทั้งหมดตอนนี้สิ่งที่ฉันต้องทำก็คือลบไฟล์เมื่อคลิก #clear_log ฉันรู้ว่าการเสียบ do_action บน init จะลบออกทันทีที่โหลดหน้าเว็บทำให้จาวาสคริปต์ของฉันไร้ประโยชน์ดังนั้นฉันเดาตัวเลือกเดียวคือ ajax! ฉันต้องเพิ่มการอ้างอิงอื่นไปยัง wp_localize_script () หรือไม่ ความช่วยเหลือใด ๆ ที่จะได้รับการชื่นชม


ขอบคุณพวกคุณทุกคนค่ะ ฉันไม่เคยคิดเกี่ยวกับการใช้ nonce เพื่อลบตัวเลือก ฉันยังไม่ได้ทำงานเลย แต่ฉันคิดว่ามันเป็นสิ่งที่ฉันได้ทำไปแล้วฉันจะทุบตีอย่างดีเพื่อให้ทุกอย่างที่คุณพูดบนกระดาน
เทรซี่

@ brasofilo ขอบคุณสำหรับความคิดเห็นของคุณ ฉันเชื่อว่าการอธิบายช่วยให้ผู้อื่นเข้าใจและสามารถช่วยคุณแก้ปัญหาได้มากขึ้น
เทรซี่

สวัสดี @ Tracy nonce เป็นเพียงการตรวจสอบเพียงครั้งเดียวเพื่อให้แน่ใจว่าคำขอนั้นถูกต้องนั่นคือมาจากไซต์ของคุณและคุณตั้งใจจะทำ หากคุณต้องการแก้ไขโพสต์ด้วยรหัสที่คุณมีตอนนี้ฉันแน่ใจว่าทุกคนยินดีที่จะดู
Andrew Bartel

ขออภัยเกี่ยวกับสิ่งนั้น ฉันทำสิ่งที่ฉันตั้งใจจะทำสำเร็จแล้ว ฉันใช้ ajax ใน # debug.click () เพื่อโหลดบันทึกแล้ว ajax อีกครั้งใน # clear_log.click () เพื่อลบบันทึก อาจมีวิธีที่ดีกว่า (ใช้ตัวอย่าง ajax 1 ครั้ง) แต่ตอนนี้ใช้งานได้แล้วฉันสามารถทดสอบทฤษฎีเหล่านี้ได้ ขอบคุณอีกครั้งสำหรับความเข้าใจของคุณ!
เทรซี่

คำตอบ:


7

Ajax ใน WordPress ทำงานโดยการส่งโพสต์ HTTP ไปยัง /wp-admin/admin-ajax.php (โดยค่าเริ่มต้น) ที่จะทำการเชื่อมต่อ hook ที่เกี่ยวข้อง ดังนั้นคุณแนบ jquery บางอย่างกับเหตุการณ์ที่เกิดขึ้นจากปุ่มลบของคุณซึ่งจะโพสต์ไปที่ admin-ajax.php ซึ่งมีการดำเนินการพูด delete_my_options () ซึ่งจริง ๆ แล้วเรียกใช้ php เพื่อลบ จากนั้นคุณมีฟังก์ชั่นที่เรียกว่า callback ซึ่งจะทำงานได้สำเร็จตามคำขอ ajax คุณสามารถใช้สิ่งนี้เพื่อทำให้ #log ของคุณจางหายไปตัวอย่างเช่น

ในระยะสั้นคุณมีสามขั้นตอนการกระทำ ajax และโทรกลับ การดำเนินการถูกทริกเกอร์โดยเหตุการณ์ DOM และแนบกับสอง hooks wp_ajax_ {action_name} และ wp_ajax_nopriv_ {action_name} (เฉพาะในกรณีที่คุณไม่ต้องการให้ผู้ใช้ที่เข้าสู่ระบบสามารถทำได้) ไฟเหล่านี้เมื่อการกระทำนั้นถูกโพสต์ไปที่ wp-admin / admin-ajax.php ajax เป็นฟังก์ชั่น php (โดยปกติ) ฟังก์ชั่นการโทรกลับเป็นฟังก์ชั่นจาวาสคริปต์ที่มีการยิงเมื่ออาแจ็กซ์เสร็จสมบูรณ์

เป็นขั้นเป็นตอน:

ขั้นตอนที่ 1 ในไฟล์ js ของคุณ

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);

}); 

ขั้นตอนที่ 2 ใน function.php หรือปลั๊กอินของคุณ

เพิ่มสิ่งนี้ไปยังฟังก์ชั่นที่คุณเข้าคิวจาวาสคริปต์ของคุณจาก: (ขอบคุณ @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' ), ) );

จากนั้นเพิ่มสิ่งนี้ไปยัง functions.php หรือปลั๊กอินของคุณ:

// 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
    }
}

ขั้นตอนที่ 3 กลับมาในไฟล์ js ของคุณ

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

4
สิ่งหนึ่งที่ฉันจะเปลี่ยนที่นี่คือการใช้admin_urlกับwp_localize_scriptการส่งออกadmin-ajax.phpURL มันไม่ได้'/wp-admin/admin-ajax.php'อยู่ในหลายกรณีขึ้นอยู่กับเฉพาะการติดตั้ง
Milo

5
wp_ajax_nopriv_clear_log_actionฉันจะออกไป ทำไมผู้เยี่ยมชมควรได้รับอนุญาตให้ล้างบันทึก? :)
fuxia

2
ฉันอยากให้มันเป็นตัวอย่างทั่วไป :) แต่จุดที่ถูกต้องมาก ๆ แก้ไข nopriv และใส่ ajaxurl ไว้ในนั้น
Andrew Bartel

5
นอกจากนี้คุณควรเพิ่ม nonce เพื่อป้องกันการโจมตี CSRF นอกจากนี้ is_admin () ไม่ใช่การตรวจสอบที่ถูกต้องเพื่อดูว่าผู้ใช้เป็นผู้ดูแลระบบหรือไม่นั้นจะตรวจสอบเพื่อดูว่าคุณอยู่ในเส้นทาง wp-admin หรือไม่ ดังนั้นคุณควรตรวจสอบเพื่อดูว่า current_user_can ('Manage_options') หรือไม่
อ็อตโต

4
คุณเพิ่งได้รับคำแนะนำที่ยอดเยี่ยมจากสามน้ำหนักที่หนักคำตอบคือคำแนะนำที่เป็นแบบอย่างของ Ajax รหัสนี้จะถูกคัดลอกจำนวนครั้งที่วางและฉันจำไม่ได้เห็นคำถามแรกที่เขียนได้ดีรุ่งโรจน์ถึง @ ทั้งหมด :)
brasofilo
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.