---
title: "Laktek, jQuery Smart Autocomplete"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/190679-laktek-jquery-smart-autocomplete"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "bikic"
published: "2012-11-26T10:40:19.000Z"
updated: "2012-11-26T21:55:25.000Z"
replies: 6
views: 685
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/190679-laktek-jquery-smart-autocomplete"
---
# Laktek, jQuery Smart Autocomplete
## #1 — bikic, 2012-11-26T10:40Z
Hej alla!
Användaren Laktek har skapat en fantastisk autocomplete med många inbyggda funktioner. Du kan läsa mer om det här:
Jag behöver er hjälp med en sak:
Laktek har gjort det enkelt med sina exempel. Han har bland annat skapat ett exempel där man hämtar data från en fil med hjälp av Json. Datan i filen ser då ut enligt följande:
```
["Niklas", "Ludde", "Olle"]
```
osv...
Jag har gjort om filen lite grann så den ser ut så här:
```
[
{"url":http://www.google.se,"name":"Niklas"},
{"url":http://www.google.se,"name":"Ludde"},
{"url":http://www.google.se,"name":"Olle"}
]
```
Vad jag vill är att man med hjälp av **filter** och **resultFormatter** ska kunna söka efter **"name"**, men presentera **"name"** som en klickbar länk med **"URL"** som den faktiska länken.
resultFormatter skulle kunna se ut så här:
```
resultFormatter: function(result){
[INDENT]return '" + result.name + ''[/INDENT]
}
```
Jag har suttit och trixat i ett par dagar nu men får det inte till att fungera.
Någon vänlig själ som vill hjälpa mig?
Mvh Niklas
Permalänk: https://www.webforum.nu/p/190679
## #2 — voigtann1, 2012-11-26T15:06Z
Vad har du försökt med filter?
fick igång det mer eller mindre direkt om man följde guiden på sidan:
```
$("input").smartAutoComplete({
source: [
{"url":"http://www.google.se","name":"Niklas"},
{"url":"http://www.google.se","name":"Ludde"},
{"url":"http://www.google.se","name":"Olle"}
],
resultFormatter: function(result){
return '' + result.name + '';
},
filter: function(term, source){
var filtered_and_sorted_list = $.map(source, function(item) {
var score = item.name.toLowerCase().score(term.toLowerCase());
if(score > 0) {
return { 'result': item, 'value': score }
}
}).sort(function(a, b){ return b.value - a.value });
return $.map(filtered_and_sorted_list, function(item){
return item.result;
});
}
});
```
Permalänk: https://www.webforum.nu/p/2306370
## #3 — bikic, 2012-11-26T20:55Z
Märkligt!
Tack, du använder quicksilverpluginet, det hade jag missat ;)
Men det är ändå något som inte stämmer när man klickar på länken i dropdownlistan. Den triggas inte. Vad kan det bero på?
Permalänk: https://www.webforum.nu/p/2306378
## #4 — voigtann1, 2012-11-26T21:00Z
> **[bikic skrev:](https://www.webforum.nu/p/1556807)**
>
> Märkligt!
>
> Tack, du använder quicksilverpluginet, det hade jag missat ;)
>
> Men det är ändå något som inte stämmer när man klickar på länken i dropdownlistan. Den triggas inte. Vad kan det bero på?
du missade även att avsluta strängar.
Min gissning är att det finns ett click event som körs och stoppar default eventet på dina a-element.
Permalänk: https://www.webforum.nu/p/2306379
## #5 — bikic, 2012-11-26T21:25Z
Ok,
läste något på Github om en IE bug som inte gjorde länkarna klickbara, men det skulle vara uppdaterat i den senaste filen.
Jag får allt att fungera nu, men inte när jag har source via en fil - som returnerar exakt samma värde.
Permalänk: https://www.webforum.nu/p/2306382
## #6 — voigtann1, 2012-11-26T21:28Z
har du dom-ready runt din kod, ligger din js kod efter elementet du vill binda plugin:et på? inte lätt att utgå ifrån vad du gör för fel om du inte berätta vad du gör och vad som inte fungera.
du skall kunna binda/kolla på eventet 'itemSelect' för nu binds den på mousedown eventet.
Permalänk: https://www.webforum.nu/p/2306383
## #7 — bikic, 2012-11-26T21:55Z
Min kod ser ut så här och ligger emellan en massa annan kod:
```
```
jquery.page.kundservice.js ser ut enligt följande:
```
$(document).ready(function() {
$("#searchQuery").smartAutoComplete({
source: [
{"url":"http://www.google.se/","name":"Niklas"},
{"url":"http://www.google.se/","name":"Olle"}
],
resultsContainer: "ul#results",
resultFormatter: function(result){
return '' + result.name + '';
},
filter: function(term, source){
var filtered_and_sorted_list = $.map(source, function(item) {
var score = item.name.toLowerCase().score(term.toLowerCase());
if(score > 0) {
return { 'result': item, 'value': score }
}
}).sort(function(a, b){ return b.value - a.value });
return $.map(filtered_and_sorted_list, function(item){
return item.result;
});
},
forceSelect: true,
maxResults: 5,
delay: 0,
minCharLimit: 1
});
$("#searchQuery").bind({
keyIn: function(){
$(this).smartAutoComplete().clearResults();
},
noResults: function(ev){
$("ul#results").html("Vi hittar dessvärre inget som matchar med det du söker på.");
ev.preventDefault();
}
});
});
```
Permalänk: https://www.webforum.nu/p/2306385
---
Tråden på webben: https://www.webforum.nu/amne/javascript/190679-laktek-jquery-smart-autocomplete