web-dev-qa-db-ja.com

フォームでAJAXを使用する

WordPressでAJAXを使用してフォームを検証して送信しようとしていますが、返される応答は0です。 コーデックスによると 、これはadmin-ajaxが私が定義した関数を見つけることができないことを示しているようです。

何がおかしいのですか？

コード（デモ用に簡略化）

<script type="text/javascript">

jQuery(function()
{
    jQuery(document).on('click', '#test-button', function()
    {
        var name = jQuery("#name").val();
        var AdminAJAX = <?php echo json_encode(admin_url('admin-ajax.php')); ?>;

        var ajaxparams = {
            action: 'jp_ajax_request',
            name: name
            };

        jQuery.post( AdminAJAX, ajaxparams, function( response )
        {
            alert(response);
        });
    }
}
</script>

<?php
add_action( 'wp_ajax_jp_ajax_request', 'jp_ajax_process');
add_action( 'wp_ajax_nopriv_jp_ajax_request', 'jp_ajax_process');

function jp_ajax_process()
{
    echo 'ajax response';
    die();
}
?>

<form action="">
    <input type="text" id="name">
    <button id="test-button">Submit</button>
</form>
ajaxformsfront-end
1
William

あなたのadd_action()がAJAXハンドラを呼び出すのが遅すぎます。

これらのフックを先に追加してください。最善のアクションはおそらくwp_loadedです。

add_action( 'wp_loaded', 'register_ajax_handlers' );

function register_ajax_handlers()
{
    add_action( 'wp_ajax_jp_ajax_request', 'jp_ajax_process');
    add_action( 'wp_ajax_nopriv_jp_ajax_request', 'jp_ajax_process');
}

AJAXのデバッグ も参照してください。

このコードは、プラグインまたはテーマのfunctions.phpに配置する必要があります。

2
fuxia