2011-04-08 18 views
2

我正在設計一個基於主題的WordPress主題,其主要工作組合分頁必須能夠在用戶每次點擊「按年訂購」時進行更改, 「按標題排序」和「按收藏排序」(使用分類分頁)全部使用ajax。 我已經編碼了一些功能以下這些twoposts和這些twoanswers,但它不起作用。我對ajax完全陌生,所以請耐心等待我! 任何建議爲更好的方法來保持乾燥非常感激。 非常感謝您提前。如何使用AJAX在Wordpress中更改分頁

UPDATE 我自己解決了這個問題。我打電話給不同的班級,所有的程序都很好。更正了下面的代碼。

init.js:

$(function(){ 

var obra_links = $(".select_date, .select_title, .select_collection"); 
var obra_archive = $(".obra_archive"); 

obra_links.bind('click', function() { 
    var $archive_class = $(this).attr("class"); 
    $(this).parent().find('.selected').removeClass('selected'); 
    $(this).toggleClass('selected'); 
    obra_archive.fadeOut(500); 
    $.ajax(
     MyAjax.url,{ 
      type: 'POST', 
      cache: false, 
      data: { 
       action: 'obra_date_toggle', 
       archive_class: $archive_class 
      }, 
      success: function(new_archive){ 
       obra_archive.html(new_archive); 
      }, 
     }) 
    obra_archive.fadeIn(500); 
}, false); 
}); 

的functions.php:

`[...]` 

function childtheme_override_head_scripts() { 
if (!is_admin()) { 
// jQuery Google APIs 
    wp_deregister_script('jquery'); 
    wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"), false); 
    wp_enqueue_script('jquery'); 
// Custom 
    wp_enqueue_script('init', JS . '/init.js', array('jquery'), false, false); // Change last value to true but separate typekit. 
// AJAX 
    wp_localize_script('init', 'MyAjax', array('url' => admin_url('admin-ajax.php'))); 
} add_action('init', 'childtheme_override_head_scripts'); 

function select_date() { 
// New Query 
$args = array(
    'post_type' => 'obra', 
    'posts_per_page' => '-1', 
    'orderby' => 'date', 
    'order' => 'ASC', 
    //'orderby' => 'title', 
    //'taxonomy' => 'colecciones' 
); $wp_query = new WP_Query($args); 

if ($wp_query`->`have_posts()) { 
    while ($wp_query->have_posts()) : $wp_query->the_post(); ?> 
     <div <?php post_class() ?> id="post-<?php the_ID(); ?>"> 
      <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> 
      <small><?php the_time('F jS, Y') ?> <!-- by <?php the_author() ?> --></small> 
      <div class="entry"> 
       <?php the_content('Read the rest of this entry &raquo;'); ?> 
      </div> 
      <p class="postmetadata"><?php the_tags('Tags: ', ', ', '<br />'); ?> Posted in <?php the_category(', ') ?> | <?php edit_post_link('Edit', '', ' | '); ?> <?php comments_popup_link('No Comments ', '1 Comment ', '% Comments '); ?></p> 
     </div><?php 
    endwhile; 
} else { ?> 
    <h2 class="center">Not Found</h2> 
    <p class="center">Sorry, but you are looking for something that isn't here.</p> 
    <?php get_search_form(); 
} 
} 

function select_title() { 
`[...]` 
} 

function select_collection() { 
`[...]` 
} 


function obra_date_toggle() { 
if(isset($_POST['archive_class'])) { 
    $archive_class = $_POST['archive_class']; 
} 
switch ($archive_class) { 
    case "select_date": 
     select_date(); 
     die(); 
     break; 

    case "select_title": 
     select_title(); 
     die(); 
     break; 

    case "select_collection": 
     select_collection(); 
     die(); 
     break; 

    default: 
     echo select_date(); 
     // For initial load, don't die 
} 

} add_action('wp_ajax_nopriv_obra_date_toggle', 'obra_date_toggle'); 
add_action('wp_ajax_obra_date_toggle', 'obra_date_toggle'); 

obra.php:

<?php 
/* 
Template Name: Obra 
*/ 

// calling the header.php 
get_header(); 

// action hook for placing content above #container 
thematic_abovecontainer(); 

?> 

    <div id="container"> 

     <?php thematic_abovecontent(); ?> 

     <div id="content"> 
      <p> 
       <a class="select_date" href="#">Ordenar por fecha</a><br /> 
       <a class="select_title" href="#">Ordenar por t&iacute;tulo</a><br /> 
       <a class="select_collection" href="#">Ordenar por colecci&oacute;n</a><br /> 
      </p> 

      <div class="obra_archive"><?php 

       obra_date_toggle(); 

      ?></div><!-- .obra-archive --><?php 

       wp_reset_postdata(); 

       // calling the widget area 'page-top' 
       get_sidebar('page-top'); 

       // calling the widget area 'page-bottom' 
       get_sidebar('page-bottom'); 

      ?></div><!-- #content --> 

     <?php thematic_belowcontent(); ?> 

    </div><!-- #container --> 

<?php 

// action hook for placing content below #container 
thematic_belowcontainer(); 

// calling the standard sidebar 
thematic_sidebar(); 

// calling footer.php 
get_footer(); 

?> 
+1

íctor,請您詳細說明問題嗎?您是否收到來自AJAX呼叫的任何數據?他們是否被觸發了? – AJJ 2011-04-08 10:43:01

+0

謝謝@AJweb,這就是我所做的。問題是html類。他們破折號而不是下劃線,我忘了退出;謝謝! – 2011-04-09 05:47:07

+0

請查看下面的URL使用jquery的WordPress的ajax apgination http://www.wpmods.com/easily-ajax-wordpress-pagination – Jignesh 2011-04-30 09:25:31

回答

1

UPDATE我自己解決了這個問題。我打電話給不同的班級,所有的程序都很好。更正了下面的代碼。