我正在尝试设置一个定制的searchform,允许访问者搜索链接到几个分类法术语的帖子。自动完成部分似乎工作正常,但我不知道如何获取术语slug,以便在访问者选择术语名称后构建查询字符串。
以下是HTML:
<fieldset>
<div class="">
<label for="collection">Collections : </label>
<input id="collection">
</div>
<div class="">
<label for="sujet">Sujets : </label>
<input id="sujet">
</div>
<div class="">
<label for="lieu">Lieux : </label>
<input id="lieu">
</div>
<div class="">
<label for="tag_perso">Mots-clés : </label>
<input id="tag_perso">
</div>
</fieldset>
Javascript:
jQuery(function() {
jQuery( "#collection" ).autocomplete({ source: availableTags.collection });
jQuery( "#sujet" ).autocomplete({ source: availableTags.sujet });
jQuery( "#lieu" ).autocomplete({ source: availableTags.lieu });
jQuery( "#tag_perso" ).autocomplete({ source: availableTags.tag_perso });
和PHP:
function get_autocomplete_source($taxonomy) {
$args = array(
\'hide_empty\' => 0,
\'fields\' => \'all\',
);
$term_objects = get_terms($taxonomy, $args);
$terms = array();
foreach ($term_objects as $term_object)
{
$return_object = new stdClass;
$return_object->value = $term_object->name;
$return_object->slug = $term_object->slug;
$terms[] = $return_object;
}
return $terms;}
已按以下方式本地化脚本:
wp_localize_script(\'cevennes_autocomplete\', \'availableTags\', array(
\'collection\' => get_autocomplete_source(\'1-collection\'),
\'sujet\' => get_autocomplete_source(\'2-sujet\'),
\'lieu\' => get_autocomplete_source(\'3-lieu\'),
\'tag_perso\' => get_autocomplete_source(\'4-tag_perso\')
));
我对Javascript有点迷茫。有人能帮忙吗?非常感谢。
最合适的回答,由SO网友:tosca 整理而成
以下是我的解决方案:
1.HTML:我为每个分类法定义了两个字段,一个用于选择/自动完成术语标签;第二个是隐藏的,用于接收相应的值(术语slug)。对于典型类别,它看起来像:
<input id="collection" type="text" placeholder="Collection">
<input id="collection-value" class="hidden-field" name="1-collection">
2。Javascript:默认事件
focus
和
select
已更改以填充这两个
label
和
value
字段:
jQuery( "#collection" ).autocomplete({
source: availableTags.collection,
focus: function(event, ui) {
// prevent autocomplete from updating the textbox
event.preventDefault();
// manually update the textbox
jQuery(this).val(ui.item.label);
},
select: function(event, ui) {
// prevent autocomplete from updating the textbox
event.preventDefault();
// manually update the textbox and hidden field
jQuery(this).val(ui.item.label);
jQuery("#collection-value").val(ui.item.value);
}
});
3。PHP:修改了2行以返回
label
和
value
:
$return_object->label = $term_object->name;
$return_object->value = $term_object->slug;