打字下拉列表中的全局页脚 [英] Global footer in typeahead dropdown
本文介绍了打字下拉列表中的全局页脚的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个包含2个类别的预先输入菜单,但在这些类别下我需要一个按钮。如何添加此全局页脚,以便在缺少2'类别时可用?
I have a typeahead menu with 2 categories, but under those categories I need to a button. How can I add this global footer, so it will be available when the 2'nd category is missing?
推荐答案
我做了什么是在每个数据集中添加一个页脚但是用CSS隐藏除最后一个之外的所有页脚,这里是代码:
What I did is to add a footer in each dataset but hide all but the last one with CSS, here's the code :
$('#search-query').typeahead([
{
remote: appUrl + 'franchiseesuggestions?query=%QUERY',
name: 'franchisees',
minLength: 3,
valueKey: 'Name',
template: [
'<p><strong>{{Name}}</strong></p>'
].join(''),
header: '<p class="tt-header">' + franchisees + '</p>',
footer: '<p class="more"><a href="/recherche?q=%QUERY">All results</a></p>',
engine: Hogan
}, {
remote: appUrl + 'citysuggestions?query=%QUERY',
name: 'cities',
minLength: 3,
valueKey: 'Name',
template: [
'<p><strong>{{Name}}</strong></p>'
].join(''),
header: '<p class="tt-header">' + cities + '</p>',
footer: '<p class="more"><a href="/recherche?q=%QUERY">All results</a></p>',
engine: Hogan
}
])
CSS魔术:
.tt-dropdown-menu .more{
display:none;
}
.tt-dropdown-menu div:last-child .more {
display:block;
}
希望这有帮助!
这篇关于打字下拉列表中的全局页脚的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文