Wordpress - 在自定义设置页面添加第二个按钮-解网

问：

如何在我的自定义 Wordpress 设置页面添加第二个按钮来执行 PHP 函数？

我尝试使用 Javascript，但这会导致其他 Wordpress 页面触发 POST 事件等问题。

function admin_settings_content_callback()
{
?>
    <div class="wrap">
        <h1>Settings</h1>
        <form method="post" action="options.php">
            <?php settings_fields('menu_details_group'); ?>
            <?php do_settings_sections('menu_details_group'); ?>
            <br />
            <br />
            <hr />
            <?php submit_button(); ?>
        </form>
    </div>

    <!-- NOTE: The JavaScript code WAS originally here -->
<?php
}

add_action('admin_init', 'custom_codes_admin_init');
function custom_codes_admin_init()
{
    add_settings_section('database_section', 'Copy Orders', 'database_section_callback', 'menu_details_group');
}

function database_section_callback()
{
    echo '
        <p>Copy all orders</p>
        <button type="button" name="copy_orders_action" class="button" id="copy-orders-button">Copy All</button>
    ';
}

// this is the function I would like to execute
function update_order_button_action()
{
    // get completed and on-hold orders with post ID's and associated user ID's
    $orders = get_post_and_user_id_();

    // loop through the users and process the orders as needed
    foreach ($orders as $order)
    {
        $user_id = $order['user_id'];
        $post_id = $order['post_id'];

        // write to the database table (this function is in a different PHP file)
        update_registrations(true, $post_id);
    }
}

这是我正在使用的 JavaScript，但它似乎不可靠。消息框会弹出，但是当单击“确定”时，除非我手动刷新页面，否则PHP函数通常不会执行。

<script>
    document.addEventListener('DOMContentLoaded', function()
    {
        const copyOrdersButton= document.getElementById('copy-orders-button');

        copyOrdersButton.addEventListener('click', function(e)
        {
            e.preventDefault();

            const confirmation = confirm('Copy All?');

            if (confirmation)
            {
                jQuery.ajax(
                {
                    type: 'POST',
                    url: '/wp-admin/admin-ajax.php',
                    data: {
                        action: 'update_order_button_action',
                    }
                });

                location.reload();
            }
        });
    });
</script>

谢谢。

javascript php html wordpress

jQuery(document).ready(function($) {

    $("#copy-orders-button").on("click", function(){

     $.ajax({
        url: ajaxurl,
        data: {
            'action':'update_order_button_action'
        },
        success:function(data) {
            // Triggers when AJAX request successful
            console.log(data);
        },
        error: function(errorThrown){
            // Triggers when AJAX request not successful
            console.log(errorThrown);
        }
     });   

    });

});

仅在特定页面上将 JS 排队的示例：

由于我不知道您在谈论哪个特定页面，因此您必须更改条件以匹配您的页面。

get_current_screen将返回当前 screen 对象。您甚至可能不需要检查查询参数。page

function enqueue_ajax_callback_script() {
    $screen = get_current_screen();
    if($screen->base == "your_screen_base" && $_GET['page'] == "your_page"){
         wp_enqueue_script( 'your-ajax-callback-handler', 'path-to-your-js-file', array('jquery'), '1.0', true);
    }
}
add_action( 'admin_enqueue_scripts', 'enqueue_ajax_callback_script' );

PHP 回调示例：

// this is the function I would like to execute
function update_order_button_action()
{

}
add_action( 'wp_ajax_update_order_button_action', 'update_order_button_action' );

Wordpress - 在自定义设置页面添加第二个按钮

Wordpress - Add Second Button to Custom Settings Page

评论

评论