根据下拉选择更改或更新WordPress循环

时间:2011-09-21 作者:nurain

我有一个联系我们的页面,通过查询自定义帖子类型“Distributors”,在侧栏上显示了9个位置我希望用户能够使用由分类法“位置”填充的下拉列表例如,如果用户从下拉列表中选择“California”,它将自动更新列表,仅使用标记有California的帖子。最好的方法是什么?此外,我不介意当用户缩小到他们的国家或州时,页面是否会刷新。

理想情况下,我希望在一个下拉列表中显示父类别,即德国、日本、美国等。然后在第二个下拉列表中填充该类别的子类别。例如,第一个下拉列表将显示USA,然后加利福尼亚将显示在第二个下拉列表中。

谢谢

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

首先使用此代码填充父下拉列表。

<select id="parent">
    <option>-</option>
    <?php
        if(taxonomy_exists(\'parent_taxonomy_name\')):
            $results = get_terms(\'parent_taxonomy_name\',array(\'fields\'=>\'all\',\'parent\'=>0));
            if ($results):
                foreach ($results as $result):
    ?>                                                                 
                    <option value="<?php echo $result->name; ?>"><?php echo $result->name; ?></option>
    <?php 
                endforeach;
            endif;
        endif;
    ?>
</select>
您可能需要使用ajax/jquery来填写第二个下拉框。

 <select id="child">
        <option>-</option>
    </select>
jquery代码如下:

jQuery("#parent").change(function(){
    jQuery.post(
        // see tip #1 for how we declare global javascript variables
        MyAjax.ajaxurl,
        {
            // here we declare the parameters to send along with the request
            // this means the following action hooks will be fired:
            // wp_ajax_nopriv_myajax-submit and wp_ajax_myajax-submit
            action : \'myajax-submit\',

            // other parameters can be added along with "action"
            parent : jQuery(this).val()
        },
        function( response ) {
            if(response[\'success\'] != false)
            {
                jQuery(\'#child\').empty().append(\'<option value="">Select Location</option>\');
                jQuery.each(response,function(index,value){
                    jQuery(\'#child\').append(\'<option value="\'+value+\'">\'+value+\'</option>\');
                });
            }
        }
    );
});
最后,在函数中处理ajax。php文件如下:

// if both logged in and not logged in users can send this AJAX request,
// add both of these actions, otherwise add only the appropriate one
add_action( \'wp_ajax_nopriv_myajax-submit\', \'myajax_submit\' );
add_action( \'wp_ajax_myajax-submit\', \'myajax_submit\' );

function myajax_submit() {
    // get the submitted parameters
    $parent = $_POST[\'parent\'];
    // generate the response
                $locations = ashyana_getTaxonomyValues( \'parent_taxonomy_name\', $parent, 0 );
                $results = array();
                if ($locations):
                    foreach ($locations as $location):                                
                        $loc[] = $location->name;
                    endforeach;
                    $response = json_encode( $loc );
                else:
                    $response = json_encode( array( \'success\' => false ) );
                endif;

    // response output
    header( "Content-Type: application/json" );
    echo $response;

    // IMPORTANT: don\'t forget to "exit"
    exit;
}
希望有帮助。注意:根据需要更改分类名称和其他参数/参数/变量。

SO网友:WorkingMan8798

只是想分享一个链接,帮助解释答案中包含的评论:

http://solislab.com/blog/5-tips-for-using-ajax-in-wordpress/

以下是其中一条评论中提到的技巧1:

使用WP\\u LOCALIZE\\u SCRIPT()声明JAVASCRIPT全局变量虽然WP\\u LOCALIZE\\u SCRIPT()是为本地化而创建的,但它还有另一个重要用途。您可以使用名称空间声明javascript变量,以便与脚本一起使用。以下是语法:

wp_localize_script( $handle, $namespace, $variable_array );
下面是您应该如何声明处理AJAX的文件的URL(在本例中,我使用admin-AJAX.php,这将在技巧2中讨论):

// embed the javascript file that makes the AJAX request
wp_enqueue_script( \'my-ajax-request\', plugin_dir_url( __FILE__ ) . \'js/ajax.js\', array( \'jquery\' ) );

// declare the URL to the file that handles the AJAX request (wp-admin/admin-ajax.php)
wp_localize_script( \'my-ajax-request\', \'MyAjax\', array( \'ajaxurl\' => admin_url( \'admin-ajax.php\' ) ) );
这样,您就不必使用PHP打印JavaScript代码,因为JavaScript代码既难看又不可缓存。如果查看元素中生成的HTML,您会发现:

<script type="text/javascript" src="http://example.com/wordpress/wp-content/plugins/myajax/js/ajax.js"></script><script type="text/javascript">// <![CDATA[
<span class="mceItemHidden">
/* 
 */
var <span class="hiddenSpellError" pre=""-->MyAjax = {
    <span class="hiddenSpellError" pre="">ajaxurl</span>:  "http://example.com/wordpress/wp-admin/admin-ajax.php"
};
/* ]]&gt; */
</span>
// ]]></script>
现在,在ajax中。js文件,可以使用MyAjax。ajaxurl无需求助于PHP并包含wp加载。php。有关设置发送请求的javascript代码以及如何正确处理请求的更多信息,请参阅下面的技巧2。

结束

相关推荐

从Custom Taxonomy获取帖子列表

我可以很好地为我的自定义分类法获取类别id或slug,但我需要能够将所有帖子作为该分类法条目的数组获取。我的代码如下:$args = array( \'post_type\' => \'product\', \'post_status\' => \'publish\', \'posts_per_page\' => -1 );&#x