根据所选父类别在下拉列表中显示 Wordpress 子类别
Display Wordpress Sub-category in dropdown based on the selected Parent Category
我试图在下拉框中显示父类别,根据选择的父类别,它们的子类别应该通过 ajax 调用显示在单独的下拉框中。
我做了很多研究,发现了以下文章,它是我需要实现的 100%:https://1stwebdesigner.com/implement-ajax-wordpress-themes/
我没看错,但由于某些原因,子类别下拉列表始终处于禁用状态。
我的最终目标是让 2 个带有提交按钮的下拉菜单并将其用作搜索表单,在单独的页面上显示所选的子类别帖子,这是我到达那里的第一步但没有运气.
我尝试将 javascript $ 更改为 jQuery,因为我第一次使用它时出现错误,但目前页面上完全没有错误。
<!-- Dropdown select box & javascript -->
<div id="content">
<?php
wp_dropdown_categories('show_count=0&selected=-1&hierarchical=1&depth=1&hide_empty=0&exclude=1&show_option_none=Main Categories&name=main_cat');
?>
<select name="sub_cat" id="sub_cat" disabled="disabled"></select>
<script type="text/javascript">
jQuery(function() {
jQuery('#main_cat').change(function() {
var $mainCat = jQuery('#main_cat').val();
// call ajax
jQuery("#sub_cat").empty();
jQuery.ajax({
url: "/wp-admin/admin-ajax.php",
type: 'POST',
data: 'action=my_special_action&main_catid=' + $mainCat,
success: function(results) {
// alert(results);
jQuery("#sub_cat").removeAttr("disabled");
jQuery("#sub_cat").append(results);
}
});
});
});
</script>
</div>
<!-- Ajax call in function.php -->
add_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function implement_ajax() {
if(isset($_POST['main_catid']))
{
$categories= get_categories('child_of='.$_POST['main_catid'].'&hide_empty=0');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= ' ('.$cat->category_count.')';
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Scegli...</option>'.$option;
die();
} // end if
}
add_action('wp_ajax_my_special_ajax_call', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_ajax_call', 'implement_ajax');//for users that are not logged in.
在 jQuery 中调用操作 action=my_special_action
,在 functions.php 中与操作挂钩的函数是 my_action_callback
但您没有定义该函数。另外,第二个钩子甚至没有触发。
试试下面的代码
<!-- Ajax call in function.php -->
add_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function my_action_callback() {
if(isset($_POST['main_catid'])) {
$categories = get_categories('child_of='.$_POST['main_catid'].'&hide_empty=0');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= ' ('.$cat->category_count.')';
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Scegli...</option>'.$option;
die();
} // end if
}
了解有关 How to use ajax in WordPress 的更多信息?
我试图在下拉框中显示父类别,根据选择的父类别,它们的子类别应该通过 ajax 调用显示在单独的下拉框中。
我做了很多研究,发现了以下文章,它是我需要实现的 100%:https://1stwebdesigner.com/implement-ajax-wordpress-themes/
我没看错,但由于某些原因,子类别下拉列表始终处于禁用状态。
我的最终目标是让 2 个带有提交按钮的下拉菜单并将其用作搜索表单,在单独的页面上显示所选的子类别帖子,这是我到达那里的第一步但没有运气.
我尝试将 javascript $ 更改为 jQuery,因为我第一次使用它时出现错误,但目前页面上完全没有错误。
<!-- Dropdown select box & javascript -->
<div id="content">
<?php
wp_dropdown_categories('show_count=0&selected=-1&hierarchical=1&depth=1&hide_empty=0&exclude=1&show_option_none=Main Categories&name=main_cat');
?>
<select name="sub_cat" id="sub_cat" disabled="disabled"></select>
<script type="text/javascript">
jQuery(function() {
jQuery('#main_cat').change(function() {
var $mainCat = jQuery('#main_cat').val();
// call ajax
jQuery("#sub_cat").empty();
jQuery.ajax({
url: "/wp-admin/admin-ajax.php",
type: 'POST',
data: 'action=my_special_action&main_catid=' + $mainCat,
success: function(results) {
// alert(results);
jQuery("#sub_cat").removeAttr("disabled");
jQuery("#sub_cat").append(results);
}
});
});
});
</script>
</div>
<!-- Ajax call in function.php -->
add_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function implement_ajax() {
if(isset($_POST['main_catid']))
{
$categories= get_categories('child_of='.$_POST['main_catid'].'&hide_empty=0');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= ' ('.$cat->category_count.')';
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Scegli...</option>'.$option;
die();
} // end if
}
add_action('wp_ajax_my_special_ajax_call', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_ajax_call', 'implement_ajax');//for users that are not logged in.
在 jQuery 中调用操作 action=my_special_action
,在 functions.php 中与操作挂钩的函数是 my_action_callback
但您没有定义该函数。另外,第二个钩子甚至没有触发。
试试下面的代码
<!-- Ajax call in function.php -->
add_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function my_action_callback() {
if(isset($_POST['main_catid'])) {
$categories = get_categories('child_of='.$_POST['main_catid'].'&hide_empty=0');
foreach ($categories as $cat) {
$option .= '<option value="'.$cat->term_id.'">';
$option .= $cat->cat_name;
$option .= ' ('.$cat->category_count.')';
$option .= '</option>';
}
echo '<option value="-1" selected="selected">Scegli...</option>'.$option;
die();
} // end if
}
了解有关 How to use ajax in WordPress 的更多信息?