21288 Posts in 5733 Topics by 2602 members
|
Page:
1
|
Go to End | |
| Author | Topic: | 1532 Views |
-
AutoComplete with SilverStripe – how to?

28 December 2010 at 9:40pm
Hi SilverStripe Forums
I have a rather huge site with about 700 pages filled with information about wines from Italy: Italiensk Vinguide
I have a search form on all pages and I've been tracking the keywords typed in by the visitors. This data tells me that many people are doing lot's of spelling mistakes and typos – and this naturally turns into poor search results hence loss of visitors and bad experiences.
A way to solve this would be an autocomplete service and I could e.g. use the jQuery autocomplete plugin for this. Now, how would I accomplish this? And is this the best way to solve such a problem?
Any suggestions would be appreciated.
Thanks.
Joel
-
Re: AutoComplete with SilverStripe – how to?

28 December 2010 at 10:29pm
I use this for a webshop form:
Controller:
function productajaxsearch(){
if(isset($this->request) && $term = $this->request->getVar('term')){
$where = "Title LIKE '%" . (string)$term . "%' OR SubTitle LIKE '%" . (string)$term . "%' OR Content LIKE '%" . (string)$term . "%'";
if($products = DataObject::get('Product', $where)){
$return_arr = array();
foreach($products as $p){
$array['link'] = $p->Link();
$array['title'] = $p->Title;
$array['image'] = '<img src="'.$p->Image()->SetWidth(50)->Link().'" />';
array_push($return_arr,$array);
}
return json_encode($return_arr);
}
}
}jQuery autocomplete code:
var div = document.getElementById('SearchForm_ProductSearchForm_Search');
if (div !== null){
var cache = {};
$( "#SearchForm_ProductSearchForm_Search" ).autocomplete({
minLength: 2,
source: function(request, response) {
if ( request.term in cache ) {
response( cache[ request.term ] );
return;
}
$.ajax({
url: "Page_Controller/productajaxsearch",
dataType: "json",
data: request,
success: function( data ) {
cache[ request.term ] = data;
response( data );
}
});
}
}).data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( '<div class="searchitem">' + item.image + '<div class="searchtitle"><a href="'+item.link+'">' + item.title + '</a></div><div class="clear"></div></div>' )
.appendTo( ul );
};
} -
Re: AutoComplete with SilverStripe – how to?

30 December 2010 at 11:00pm
Hi Martijn
So many thanks for the hint. This is awesome.
If I do this will it then slower the database? What is your opinion on this?
Thanks
Joel
-
Re: AutoComplete with SilverStripe – how to?

2 January 2011 at 10:11am Last edited: 3 January 2011 11:47pm
Hi
The autocomplete feature is now working at our site: http://www.italienskvinguide.dk
@Martijn – can you post a link to the webshop, you are talking about? I'm curious to SilverStripe in action as a webshop.
Joel
| 1532 Views | ||
|
Page:
1
|
Go to Top |


