WordPress分页不适用于AJAX [英] WordPress Pagination not working with AJAX

问题描述

我正在通过AJAX加载一些帖子，并且我的WordPress分页使用以下函数来计算分页:

get_pagenum_link($paged - 1)

问题在于通过AJAX创建分页，因此使该链接看起来像:http://localhost:1234/vendor_new/wp-admin/admin-ajax.php

不过，我要尝试达到的实际URL就是这样的: http://localhost:1234/vendor_new/display-vendor-results

是否可以在AJAX中使用此功能，并且仍然获得正确的分页URL?

解决方案

我可以为您想到三个选择:

1. 编写自己的get_pagenum_link()版本，允许您指定基本URL
2. 在调用get_pagenum_link()
时覆盖$_SERVER['REQUEST_URI']变量
3. 要调用paginate_links()函数，请返回整个分页的HTML，然后使用JS处理该HTML，以仅获取上一个/下一个链接.

#1 get_pagenum_link()的自定义版本

优点:您必须更改少量当前代码-基本上只需更改要调用的函数的名称并传递一个额外的参数即可.

缺点:如果功能将来会发生变化(不太可能，但可能会发生变化)，那么您也必须调整功能.

我只会发布自定义函数的相关代码-您可以假设其他所有内容都可以保留在核心版本中.

function my_get_pagenum_link( $pagenum = 1, $escape = true, $base = null ) {
    global $wp_rewrite;

    $pagenum = (int) $pagenum;

    $request = $base ? remove_query_arg( 'paged', $base ) : remove_query_arg( 'paged' );

因此，在这种情况下，我们还有一个参数允许我们指定基本URL-硬编码URL(不是一个好主意)或动态生成URL由您决定.处理您的AJAX请求的代码将发生以下变化:

my_get_pagenum_link( $paged - 1, true, 'http://localhost:1234/vendor_new/display-vendor-results' );

关于此解决方案，就是这样.

---

#2覆盖$_SERVER['REQUEST_URI']变量

优点:相当容易实现，应该是面向未来的.

缺点:可能有副作用(理论上不应该，但你永远不知道)；您可能需要编辑JS代码.

您可以使用在后端获得的值或随AJAX请求传递的值来覆盖它(因此，在AJAX请求中，可以有一个实例base的参数类似于window.location.pathname + window.location.search).区别在于，在第二种情况下，您的JS可以在任何页面上运行(如果将来您最终拥有多个位置时使用同一AJAX处理程序).

我将发布覆盖变量的代码，然后将其还原.

// Static base - making it dynamic is highly recommended
$base = '/vendor_new/display-vendor-results';
$orig_req_uri = $_SERVER['REQUEST_URI'];

// Overwrite the REQUEST_URI variable
$_SERVER['REQUEST_URI'] = $base;

// Get the pagination link
get_pagenum_link( $paged - 1 );

// Restore the original REQUEST_URI - in case anything else would resort on it
$_SERVER['REQUEST_URI'] = $orig_req_uri;

这里发生的是，我们只是简单地用我们自己覆盖了REQUEST_URI变量-这样，我们使add_query_arg函数误以为是在/vendor_new/display-vendor-results页面上，而不是在/wp-admin上/admin-ajax.php

---

#3使用paginate_links()并使用JS操作HTML

专业人士:目前真的想不起任何事情.

缺点:您必须同时调整PHP和JavaScript代码.

这里是个主意:您可以使用 paginate_links() 及其参数来创建所有分页链接(嗯-至少有四个-上一个/下一个和第一个/最后一个).然后，您将所有这些HTML作为参数传递给响应(如果您使用JSON，或者如果只是返回HTML，则作为响应的一部分).

PHP代码:

global $wp_rewrite, $wp_query;

// Again - hard coded, you should make it dynamic though
$base = trailingslashit( 'http://localhost:1234/vendor_new/display-vendor-results' ) . "{$wp_rewrite->pagination_base}/%#%/";
$html = '<div class="mypagination">' . paginate_links( array(
    'base' => $base,
    'format' => '?paged=%#%',
    'current' => max( 1, $paged ),
    'total' => $wp_query->max_num_pages,
    'mid_size' => 0,
    'end_size' => 1,
) ) . '</div>';

JS代码(应该在AJAX成功回调中):

// the html variable is supposed to hold the AJAX response
// either just the pagination or the whole response
jQuery( html ).find('.mypagination > *:not(.page-numbers.next,.page-numbers.prev)').remove();

这里发生的是，我们找到了<div class="mypagination">内部的所有元素，除了prev/next链接之外，我们将其删除.

---

总结一下:

最简单的解决方案可能是#2 ，但是如果某人出于某种原因需要知道当前页面为admin-ajax.php 同时，则可以生成链接，那么您可能会遇到问题.可能甚至没有人会注意到，因为这将是您的代码正在运行，并且可以附加到过滤器的任何函数也应该认为它们在您需要的页面上(否则它们可能会弄乱某些东西).

PS:如果由我决定，我将始终使用paginate_links()函数并在前端显示页码.然后，我将使用相同的函数在AJAX处理程序中生成更新的HTML.

I'm loading some posts though AJAX and my WordPress pagination is using the following function to calculate paging:

get_pagenum_link($paged - 1)

The issue is that the pagination is getting created through AJAX so it's making this link look like: http://localhost:1234/vendor_new/wp-admin/admin-ajax.php

However the actual URL that I'm trying to achieve is for this: http://localhost:1234/vendor_new/display-vendor-results

Is there a way to use this function with AJAX and still get the correct URL for paging?

解决方案

I can think of three options for you:

1. To write your own version of get_pagenum_link() that would allow you to specify the base URL
2. To overwrite the $_SERVER['REQUEST_URI'] variable while you call get_pagenum_link()
3. To call the paginate_links() function, return the whole pagination's HTML and then process that with JS to only take the prev/next links.

#1 Custom version of get_pagenum_link()

Pros: you would have to change a small amount of your current code - basically just change the name of the function you're calling and pass an extra argument.

Cons: if the function changes in the future(unlikely, but possible), you'd have to adjust your function as well.

I will only post the relevant code of the custom function - you can assume everything else can be left the way it's in the core version.

function my_get_pagenum_link( $pagenum = 1, $escape = true, $base = null ) {
    global $wp_rewrite;

    $pagenum = (int) $pagenum;

    $request = $base ? remove_query_arg( 'paged', $base ) : remove_query_arg( 'paged' );

So in this case, we have one more argument that allows us to specify a base URL - it would be up to you to either hard-code the URL(not a good idea), or dynamically generate it. Here's how your code that handles the AJAX request would change:

my_get_pagenum_link( $paged - 1, true, 'http://localhost:1234/vendor_new/display-vendor-results' );

And that's about it for this solution.

---

#2 overwrite the $_SERVER['REQUEST_URI'] variable

Pros: Rather easy to implement, should be future-proof.

Cons: Might have side effects(in theory it shouldn't, but you never know); you might have to edit your JS code.

You can overwrite it with a value that you get on the back-end, or with a value that you pass with your AJAX request(so in your AJAX request, you can have a parameter for instance base that would be something like window.location.pathname + window.location.search). Difference is that in the second case, your JS would work from any page(if in the future you end-up having multiple locations use the same AJAX handler).

I will post the code that overwrites the variable and then restores it.

// Static base - making it dynamic is highly recommended
$base = '/vendor_new/display-vendor-results';
$orig_req_uri = $_SERVER['REQUEST_URI'];

// Overwrite the REQUEST_URI variable
$_SERVER['REQUEST_URI'] = $base;

// Get the pagination link
get_pagenum_link( $paged - 1 );

// Restore the original REQUEST_URI - in case anything else would resort on it
$_SERVER['REQUEST_URI'] = $orig_req_uri;

What happens here is that we simply override the REQUEST_URI variable with our own - this way we fool the add_query_arg function into thinking, that we're on the /vendor_new/display-vendor-results page and not on /wp-admin/admin-ajax.php

---

#3 Use paginate_links() and manipulate the HTML with JS

Pros: Can't really think of any at the moment.

Cons: You would have to adjust both your PHP and your JavaScript code.

Here is the idea: you use paginate_links() with it's arguments to create all of the pagination links(well - at least four of them - prev/next and first/last). Then you pass all of that HTML as an argument in your response(if you're using JSON - or as part of the response if you're just returning the HTML).

PHP code:

global $wp_rewrite, $wp_query;

// Again - hard coded, you should make it dynamic though
$base = trailingslashit( 'http://localhost:1234/vendor_new/display-vendor-results' ) . "{$wp_rewrite->pagination_base}/%#%/";
$html = '<div class="mypagination">' . paginate_links( array(
    'base' => $base,
    'format' => '?paged=%#%',
    'current' => max( 1, $paged ),
    'total' => $wp_query->max_num_pages,
    'mid_size' => 0,
    'end_size' => 1,
) ) . '</div>';

JS code(it's supposed to be inside of your AJAX success callback):

// the html variable is supposed to hold the AJAX response
// either just the pagination or the whole response
jQuery( html ).find('.mypagination > *:not(.page-numbers.next,.page-numbers.prev)').remove();

What happens here is that we find all elements that are inside the <div class="mypagination">, except the prev/next links and we remove them.

---

To wrap it up:

The easiest solution is probably #2, but if someone for some reason needs to know that the current page is admin-ajax.php while you are generating the links, then you might have an issue. The chances are that no one would even notice, since it would be your code that is running and any functions that could be attached to filters should also think that they are on the page you need(otherwise they might mess something up).

PS: If it was up to me, I was going to always use the paginate_links() function and display the page numbers on the front-end. I would then use the same function to generate the updated HTML in the AJAX handler.

这篇关于WordPress分页不适用于AJAX的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！