WordPress 自定义分类过滤器答案

【问题标题】：Wordpress Custom Taxonomy FilterWordPress 自定义分类过滤器
【发布时间】：2014-11-19 23:02:09
【问题描述】：

我正在尝试创建一个像这样工作的产品过滤器：

http://www.permco.com/

我已经达到了一个点，我已经调用了分类并将它们放入下拉列表中。

$prodtype = array(
   'show_option_all'    => '',
   'show_option_none'   => '',
   'orderby'            => 'ID', 
   'order'              => 'ASC',
   'show_count'         => 0,
   'hide_empty'         => 1, 
   'child_of'           => 0,
   'exclude'            => '',
   'echo'               => 1,
   'selected'           => 0,
   'hierarchical'       => 0, 
   'name'               => 'cat',
   'id'                 => '',
   'class'              => 'postform',
   'depth'              => 0,
   'tab_index'          => 0,
   'taxonomy'           => 'product-types',
   'hide_if_empty'      => false,
); 
$displacement = array(
   'show_option_all'    => '',
   'show_option_none'   => '',
   'orderby'            => 'ID', 
   'order'              => 'ASC',
   'show_count'         => 0,
   'hide_empty'         => 1, 
   'child_of'           => 0,
   'exclude'            => '',
   'echo'               => 1,
   'selected'           => 0,
   'hierarchical'       => 0, 
   'name'               => 'cat',
   'id'                 => '',
   'class'              => 'postform',
   'depth'              => 0,
   'tab_index'          => 0,
   'taxonomy'           => 'displacement',
   'hide_if_empty'      => false,
 ); 

<form>
<b><?php _e('Product Type'); ?></b><br/>
<?php wp_dropdown_categories($prodtype); ?>
<br/>
<script type="text/javascript"><!--
var dropdown = document.getElementById("cat");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');
?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
--></script>
<b><?php _e('Displacement'); ?></b><br/>
<?php wp_dropdown_categories($displacement); ?>
<br/>
<script type="text/javascript"><!--
var dropdown = document.getElementById("cat");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');
 ?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
 }
dropdown.onchange = onCatChange;
--></script>

我的问题是，我无法像在示例网站上那样使用下拉菜单来刷新页面并自动重新加载产品。

所以我想做的是，一旦用户从下拉列表中选择了一个项目，产品就会刷新并加载符合该条件的项目，然后当他们从第二个下拉列表中选择一个选项时，我希望产品自动过滤通过并仅显示与这两个选择相匹配的产品。

任何帮助将不胜感激。

【问题讨论】：

标签： php wordpress search filter custom-taxonomy

【解决方案1】：

它可以通过使用 jQuery 来完成。在您上面提到的网站中，他们实现了相同的技巧，可以在 fucntions 文件中找到..

见下文：您可以沿着这条路径实现一些东西以获得所需的结果。

来自参考的代码。网站：

e.filterChange = {init: function () { if (!jQuery.browser.mobile) { $("#filter_submit").hide(); $(".filterNote").show(); $("#form_filter .dk_options a").live($.browser.msie || $.browser.safari ? "mousedown" : "click", function (e) { $parent = $(this).closest(".dk_container"); $curValue = $parent.find(".dk_label"); setTimeout(function () { $("#form_filter").submit() }, 500) }) } }};

【讨论】：

【解决方案2】：

创建Wordpress taxonomy filter with AJAX. 的示例。这是 woocommerce 产品的分类过滤器示例。

【讨论】：