web-dev-qa-db-fra.com

En utilisant AJAX pour générer des pages d'extrémité avant/spectateur

J'essaie actuellement d'envoyer certaines données via la méthode POST à partir du code du widget de mon plug-in vers la page archive.php du thème.

Le code contenant les données pour jquery/ajax est:

<a class="ajax-post" data-year="'.$previous ->year .'" data-month="'.$previous->month.'" data-category="'.$category.'" href="' . filter_date_link($category,$previous->year, $previous->month, $day=false) . '" title="' . esc_attr( sprintf(__('View posts for %1$s %2$s'), $wp_locale->get_month($previous->month), date('Y', mktime(0, 0 , 0, $previous->month, 1, $previous->year)))) . '" id="previous_link">&laquo; ' . $wp_locale->get_month_abbrev($wp_locale->get_month($previous->month)) . '</a></td>';

$calendar_output .= "\n\t\t".'<td colspan="3" id="next"><a class="ajax-post" data-year="'.$next ->year .'" data-month="'.$next->month.'" data-category="'.$category.'"href="' . filter_date_link($category,$next->year, $next->month, $day=false) . '" title="' . esc_attr( sprintf(__('View posts for %1$s %2$s'), $wp_locale->get_month($next->month), date('Y', mktime(0, 0 , 0, $next->month, 1, $next->year))) ) . '" id="next_link">' . $wp_locale->get_month_abbrev($wp_locale->get_month($next->month)) . ' &raquo;</a></td>';

Le code js est:

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

     $('#next_link').click(function(e){
         e.preventDefault();

         var $aid =$('#next_link'),
         year =$aid.data('year'),
         month =$aid.data('month'),
         category =$aid.data('category');

     });

    $('#previous_link').click(function(e){
         e.preventDefault();

         var $aid =$('#previous_link'),
         year =$aid.data('year'),
         month =$aid.data('month'),
         category =$aid.data('category');

     });

    console.log('category: ' + category);

    $.ajax({
         cache: false,
         timeout: 8000,
         type: 'POST',
         data: {year : year, month: month, category: category},
         url: '/path/myfile.php',
         success: function(data) {},
         error: function() {}
    });

});

Et la page où ce code sera utilisé est:

<?php
//Specific class for post listing */
$blog_type = sq_option('blog_type','masonry');
$template_classes = $blog_type . '-listing';
if ($blog_type == 'standard' && sq_option('blog_meta_status', 1) == 1) { $template_classes .= ' with-meta'; }

add_filter('kleo_main_template_classes', create_function('$cls','$cls .=" posts-listing '.$template_classes.'"; return $cls;'));

if(isset($_POST['category'])){

        $category=$_POST['category'];

        $year=$_POST['year'];

        $month=$_POST['month'];

        if(isset($_POST['day'])) {

            $args = array('category_name' => $category , 
            'date_query' => array(             
                                  array(
                                    'year' => $year,                     
                                    'month' => $month,                                           
                                    'day' => $day,
                                    ),                                                               
                                    'column' => 'post_date',                          

                                ),
            );

Le tableau $args sera utilisé pour créer une nouvelle requête dans la boucle WP.

Je connais assez bien le php AJAX et jQuery sont un peu nouveaux pour moi.

Qu'est-ce qui me manque, qu'est-ce que je dois ajouter/enlever pour que cela fonctionne?.

MISES À JOUR:

  • en utilisant le code ci-dessus et en vérifiant la console dans le débogueur, je reçois: Échec de chargement de la ressource: le serveur a répondu avec un statut de 404 (Introuvable)
  • le problème ci-dessus a été résolu en utilisant la solution suggérée par le kaiser. Cependant, cette erreur est maintenant survenue à la ligne 29 de mon jQuery: Uncaught ReferenceError: la catégorie n'est pas définie .
  • Question pour le moment je n'ai pas trouvé de réponse compréhensible à: 'Où dois-je inclure la localisation et l'appel à jQuery afin que les variables soient réellement passées au format post?

Voici le code où j'utilise enqueue pour attacher le script dans mon fichier de plugins (ne sais pas si c'est le bon endroit ou la bonne manière):

add_action( 'wp_enqueue_scripts', 'theme_enqueue_scripts' );

function theme_enqueue_scripts() {

  // Enqueue and Localize AJAX JavaScript Functions File 
  wp_enqueue_script( 'ajax-categories-js', plugins_url( 'events-calendar-manager/inc/js/js.js' ), array('jquery'));

}
1
dev3078

Vous pointez sur un fichier non existant AJAX.

$.ajax( {
     // ...
     url : '/path/myfile.php',
     // ...
} );

WordPress a un fichier prédéfini pour cela:

admin_url( 'admin-ajax.php' )

Lorsque vous exécutez des requêtes publiques , vous devez les ajouter à

wp_localize_script( 'your-script-handle', 'yourJavaScriptAccessibleObject', array(
    'ajaxurl' => esc_js( admin_url( 'admin-ajax.php' ) ),
) );

Si vous ne faites que lancer des appels à des administrateurs, vous pouvez même laisser cela de côté et simplement utiliser

ajaxurl

dans votre fichier JavaScript car la variable est préremplie. Si vous avez une configuration unique, vous pouvez utiliser ce hack pour Apaches .htaccess fichier .

N'oubliez pas que vous souhaitez sécuriser vos appels AJAX à l'aide d'un NONCE:

'_ajax_nonce' => wp_create_nonce( 'your-script-handle' ),
0
kaiser