jQuery를 사용하여 wp_options에 저장된 데이터 삭제

누군가 내 문제에 대해 더 조언 할 수 있는지 궁금합니다. 내 플러그인의 일부는 디버깅 목적으로 로그 파일을 저장합니다. jquery 및 wp_localise_script를 사용하여 관리자 페이지의 (div # log)에 성공적으로 표시했습니다. 이 로그를 삭제할 수있는 버튼이 있지만 처리 방법을 잘 모르겠습니다. 나는 아약스가 여기에 유용할지 모르지만 어디서부터 시작 해야할지 모르겠다.

내 코드의 관련 부분은 다음과 같습니다.

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를 클릭 할 때 삭제하면됩니다. init에 do_action을 연결하면 페이지가로드되는 즉시 삭제되어 자바 스크립트가 쓸모 없게되므로 유일한 옵션은 아약스라고 생각합니다! wp_localize_script ()에 대한 다른 참조를 추가해야합니까? 도움을 주시면 감사하겠습니다.

WordPress의 Ajax는 HTTP 포스트를 /wp-admin/admin-ajax.php (기본적으로)에 보낸 다음 해당 후크를 발생시켜 작동합니다. 따라서 삭제 버튼으로 트리거 된 이벤트에 jquery를 첨부 한 다음 admin-ajax.php에 게시하면 delete_my_options () 액션이 있으며 실제로는 php를 실행하여 삭제합니다. 그런 다음 ajax 요청이 성공적으로 완료되면 콜백이라고하는 함수가 있습니다. 예를 들어 이것을 사용하여 #log div를 페이드 아웃 할 수 있습니다.

요컨대, 액션, 아약스 및 콜백의 세 단계가 있습니다. 조치는 DOM 이벤트에 의해 트리거되고 wp_ajax_ {action_name} 및 wp_ajax_nopriv_ {action_name}의 두 후크에 첨부됩니다 (로그인 한 사용자가 수행 할 수 없도록하려는 경우에만). 해당 작업이 wp-admin / admin-ajax.php에 게시 될 때 발생합니다. 아약스는 php (보통) 함수입니다. 콜백 함수는 아약스가 성공적으로 완료되면 시작되는 자바 스크립트 함수입니다.

단계별 :

js 파일의 1 단계

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 단계, functions.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();
}