获取AJAX搜索结果的模板问题

时间：2012-06-24 作者：Pollux Khafra

我正在尝试使用ajax将搜索结果放入div中。问题是我在说undefined function have_posts() 访问搜索模板时。它还对get_header() 在搜索结果中。php，但我把它取出来了。下面是我如何设置它的。

  <div id="my_search">
   <form role="search" method="get" id="searchform" action="http://myurl.com/" >
    <input type="text" value="" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="Search" />
   </form>
  </div>
  <div id="results"></div>
  <script type="text/javascript">
    $(document).ready(function(){
    $("#searchsubmit").click(function(e){
     e.preventDefault();
     var search_val=$("#s").val(); 
     $.post(\'http://mysite.com/wp-content/themes/beta/search-results.php\',{search_string:search_val},function(data){
        if(data.length>0){
            $("#results").html(data);
        }
     });
    });   
   });
  </script>
这是search-results.php 样板我想知道我是否没有将搜索结果传递给模板。

<ul>
 <?php if (have_posts()) : while (have_posts()) : the_post();  ?>
  <li><a title="Permalink to this post" href="<?php echo get_permalink(); ?>"><?php the_title(); ?></a></li>

 <?php endwhile; endif; ?>
 <?php if (!have_posts()) { echo(\'<li>No results to show.</li>\'); } ?>
</ul>

1 个回复
最合适的回答,由SO网友:Milo 整理而成

当您以这种方式直接加载模板文件时，您没有加载WordPress环境，因此没有可用的WordPress函数。

您的两个选项是在前端加载搜索页面并过滤结果，如：

$(\'#results\').load(\'http://mysite.com/?s=searchterm ul#target\');
或者使用WordPress提供的AJAX功能构建搜索功能，请参见AJAX in Plugins.

EDIT

下面是我如何通过AJAX加载其他帖子的一个示例，如果您愿意，可以对其进行调整以创建搜索功能。

首先，在functions.php, 我将javascript排队并本地化脚本，以传递将处理我的请求的AJAX URL。WordPress AJAX使用admin-ajax.php 要处理所有AJAX请求（前端或后端），请执行以下操作：

add_action( \'wp_enqueue_scripts\', \'wpa56343_scripts\', 100 );

function wpa56343_scripts() {
    wp_enqueue_script(
        \'wpa56343_script\',
        get_template_directory_uri() . \'/js/scripts.js?ver=1.0\',
        array( \'jquery\' ),
        null,
        false
    );
    wp_localize_script(
        \'wpa56343_script\',
        \'WPaAjax\',
        array(
            \'ajaxurl\' => admin_url( \'admin-ajax.php\' )
        )
    );
}
在中scripts.js, 调用AJAX操作并传递postoffset var，以便我可以将其传递给查询。另请注意WPaAjax.ajaxurl 要传递将处理此请求的URL，请执行以下操作：

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

    $(\'#blog-more\').click(function(e){ // <- added
        e.preventDefault(); // <- added to prevent normal form submission
        var postoffset = $(\'.post\').length;
        $.post(
            WPaAjax.ajaxurl,
            {
                action : \'wpa56343_more\',
                postoffset : postoffset
            },
            function( response ) {
                $(\'#container\').append( response );
            }
        );
    });

});
在中functions.php, 处理我的AJAX请求的函数映射到我在上面的javascript中传递的操作。WordPress的精简版已启动，因此我可以访问大多数WordPress功能：

add_action(\'wp_ajax_wpa56343_more\', \'wpa56343_more\');
add_action(\'wp_ajax_nopriv_wpa56343_more\', \'wpa56343_more\');

function wpa56343_more(){
    global $wp_query;

    $offset = $_POST[\'postoffset\'];
    $args = array(
        \'offset\' => $offset,
        \'posts_per_page\' => 10
    );
    $wp_query = new WP_Query( $args );

    get_template_part( \'post-template\' );

    exit;
}

结束
标签： search   templates   ajax   小码农  

相关推荐

如何使用AJAX和$wp_Query过滤静态发布页面

我不知所措，我发现了几个与此相关的悬而未决的问题。我有一个静态贴子页面，侧栏中有一个搜索表单。我想做的是键入一个关键字，然后“过滤”（使用ajax返回）只过滤适合搜索的帖子。我还希望它被分页。我找到了几种操纵的方法$wp_query 这样我就可以对ajax调用使用相同的循环。不幸的是当我看global $wp_query 在函数中。在我的回调操作所在的php中，它基本上是null或初始化为默认参数。我在本地调试所有东西，我想知道这是否会影响任何东西。我还没有确认，但除非显式地发生了什么事情（比如导航到新页