ワードプレスのカスタムajaxリクエスト

Question

私の質問は、ページビューから呼び出すAjax関数を作成する場所に関するものです。

私は有効な郵便番号のデータベースに対して入力された郵便番号をチェックするカスタムフォームでjQueryバリデータを使用しています。

この関数の存在場所を知りたいだけです。

通常、非ワードプレスサイトを使用する場合は、私のajax関数を使用してPHPファイルを作成し、このページのURLを参照していくつかのパラメータを渡して呼び出します。

これをWordPressでどのように実現できますか？どこで明示的にPHPファイルを呼び出して引数を渡すことができますか？

注：私はそうのようなAjaxの機能を呼び出すしたいと思います：

$.post('http://mysite.com/ajax-functions.php?fxn=zipcodes', 
    {zipCode:00000}, 
    function(response){ 
     // do stuff 
    }); 

おかげ

Answer 1

あなたは、AJAX機能

http://www.1stwebdesigner.com/css/implement-ajax-wordpress-themes/

Answer 2

に関数をフックすることができ判明簡単な方法の1つは、新しいテンプレートを作成し、このテンプレートを新しいページに割り当てることです。

ステップ1： 、あなたはこれを試してみてください、このテンプレートファイルにコードを書いて、Ajaxのリクエスト

Answer 3

用ページのURLを使用することができ、それは最も簡単な方法は、私はこの何倍に働いているこれらのコードを追加します。 functions.phpでスニペット

add_action('wp_ajax_nopriv_add_to_folder', 'add_to_folder'); 
add_action('wp_ajax_add_to_folder', 'add_to_folder'); 
function add_to_folder() {  
    global $wpdb; 
    $lbm_add_request_table = $wpdb->prefix . 'lbm_add_request'; 
    $user_id = get_current_user_id(); 
    $lbmuid = $_COOKIE['lbmuid']; 
    $lib_data_id = $_POST['lib_data_id']; 
    $return = array(); 
    $return['lib_data_id'] = $lib_data_id; 
    $getAddedData = $wpdb->get_row("SELECT * FROM $lbm_add_request_table WHERE lbmuid = '$lbmuid' AND lib_data_id = $lib_data_id ", ARRAY_N); 

    if ($getAddedData != null) { 
     $wpdb->delete($lbm_add_request_table, array('lbmuid' => $lbmuid,'lib_data_id' => $lib_data_id)); 
     $return['status'] = 'deleted'; 
    }else{ 
     $wpdb->insert( 
     $lbm_add_request_table, 
     array( 
      'user_id' => $user_id, 
      'lbmuid' => $lbmuid, 
      'lib_data_id' => $lib_data_id, 
      'add_date' => current_time('mysql') 
     )); 
     $return['status'] = 'added'; 
    } 
    echo json_encode($return); 
    exit(); 

} 

ステップ2： 今、ワードプレスがあります

<script> 
// Add to request folder ajax function call Start 
jQuery(document).on('click', '.add_to_folder', function() { 
    var lib_data_id = $(this).prev(':input').val(); 
    jQuery.ajax({ 
    url : '<?php echo admin_url('admin-ajax.php');?>', 
    type : 'post', 
    data : {lib_data_id: lib_data_id,action:'add_to_folder'}, 
    success : function(response) {   
     response = $.parseJSON(response);  
     if(response.status=='added'){  
      $("#addBtn"+response.lib_data_id).val('Remove from request folder');  
      $("#addBtn"+response.lib_data_id).addClass('remove'); 
     }else{ 
      $("#addBtn"+response.lib_data_id).val('Add to request folder'); 
      $("#addBtn"+response.lib_data_id).removeClass('remove'); 
     } 
    } 
    }); 
}); 
// Add to request folder ajax function call End 
</script> 

Answer 4

テンプレートページにAJAXを呼び出しますajaxを使って関数を作成するのに役立つajaxフック。 Wordpressはadmin ajaxに任意の機能を実行させることができます。次のコードは、Wordpressでカスタムajaxを使用するのに役立ちます。

<?php 
// javascript ajax call with click event 
add_action('wp_head', 'ajx_action_javascript_wp'); 
function ajx_action_javascript_wp() { 
?> 

<script type="text/javascript" > 
jQuery(document).ready(function($) { 
    $('.myajax').click(function(){ 
     //alert(1); 
     var mydata = $(this).data(); 
     //var termID= $('#locinfo').val(); 
     $('#wpajaxdisplay').html('<div style="text-align:center;"><img src="<?php echo get_template_directory_uri(); ?>/images/bx_loader.gif" /></div>'); 
     //console.log(mydata); 
     var data = { 
      action: 'custom_action', 
      //whatever: 1234, 
      id: mydata.id 
     }; 

     $.post('<?php echo esc_url(home_url()); ?>/wp-admin/admin-ajax.php', data, function(response) { 
      // alert('Got this from the server: ' + response); 
      $('#wpajaxdisplay').html(response);  
     }); 
    }); 
}); 

</script> 
<?php 
} 

add_action('wp_ajax_custom_action', 'custom_action_callback_wp'); 
add_action('wp_ajax_nopriv_custom_action', 'custom_action_callback_wp'); 

function custom_action_callback_wp() { 
    global $wpdb; // this is how you get access to the database 
    $getid = 'ID=> '. $_POST['id']; 
    echo $getid; 
    // do something 
    exit(); // this is required to return a proper result 
} ?> 

HTMLパート

<a href="#ajaxthing" class="myajax" data-id="600">Click On this</a> 
<div id="wpajaxdisplay">Ajax Result will display here</div>