How to customize Bootstrap typeahead layout/function for more than just text?
Posted
by
Loolooii
on Stack Overflow
See other posts from Stack Overflow
or by Loolooii
Published on 2012-06-03T19:33:42Z
Indexed on
2012/10/17
17:02 UTC
Read the original article
Hit count: 230
I'm working on a search functionality for my website and I'm using Bootstrap's typeahead to show the results. So far so good. But what I want is to extend the function so that I could add an image and some other item, say description, etc. According to this post, that is possible: custom typeahead.
Basically I need something like this as each result item:
<div class="resultContainer">
<div class="resultImage"><img /></div>
<div class="resultDesc"></div>
<div class="resultLabel"></div>
</div>
Now it's:
<li><a href="#"></a></li>
And this doesn't even work with a longer text than the width of the typeahead. So the text doesn't go to the next line and hence doesn't fit the <li>
. How can I use the the custom layout I want? (btw I have an array of arrays of results. Each sub-array contains img, desc, etc.). This is what I have right now:
Thanks in advance.
© Stack Overflow or respective owner