Coffee Script Autocomplete met jQuery, JSON en id variabele

Ik zit hier een beetje vast en kan het niet lukken om jQuery autocomplete voor mij te laten werken. Ik probeer automatisch aan te vullen met een JSON-documenttest.

D.W.Z:

http://REMOTE_HOST/names.json

Wat returs iets als:

[{"label":"Brian House", "id" : 1},
{"label":"Joe Green", "id" : 2},
{"label":"Fisher Gennings", "id" : 3},
{"label":"Sheila Williams", "id" : 4},
{"label":"Brett Nelson", "id" : 5},
{"label":"Angie Katz", "id" : 6},
{"label":"Zoe Middleton", "id" : 7},
{"label":"Parker Jones", "id" : 9}]

Wat ik wil doen is het label automatisch aanvullen in een tekstveld (user_friend_name) en dan een verborgen veld (user_friend_name_id) vullen met de id.

#user_friend_name
#user_friend_name_id

Koffiescript dat ik momenteel gebruik.

$(document).ready ->
        $('#user_friend_name').autocomplete
                source: "http://REMOTE_HOST/names.json"
                select: (event,ui) -> $("user_friend_name_id").val(ui.item.id)

Op dit moment lijkt het erop dat ik één JSON-pull krijg van alle namen, maar geen selectie of filetering terwijl je typt. Met behulp van alleen een standaard array ['foo', 'food', 'trees'] lijkt de bron prima te werken.

0

2 antwoord

Ervan uitgaande dat uw gegevens worden geretourneerd zoals u hierboven liet zien, is ui.item.id de juiste eigenschap om te openen.

Ik heb een viool van je voorbeeld gemaakt. Probeer te spelen met console.log() en console.dir() om eigenschappen te debuggen.

http://jsfiddle.net/fMWqU/

Als je nog steeds geen geluk hebt, is het probleem mogelijk je json-document. Zorg ervoor dat het document zich in hetzelfde domein bevindt als uw script om fouten tussen de originelen te voorkomen. Ik heb ook in het verleden gemerkt dat een json-document met Windows-regeleinden ervoor zorgt dat sommige browsers falen. Probeer een gewone $. Ajax() uit te voeren en gebruik console.dir() in de handlers done() en fail ().

xhr = $.ajax
  url : 'http://REMOTE_HOST/names.json'
  dataType : 'json'

xhr.done ->
  console.log arguments

xhr.fail ->
  console.log 'Fail! ', arguments
1
toegevoegd
bedankt! Ik zal kijken.
toegevoegd de auteur user41724, de bron

Ik geloof dat ze waarde niet id eigenschappen moeten hebben. Ik ben niet bekend met het koffiescript, maar ik ben er zeker van dat dit leesbaar is:

$.getJSON("http://REMOTE_HOST/names.json", function(response) {
    var newData = response.map(function(el) { return {label: el.label, value: el.id })
    $('#user_friend_name').autocomplete
        source: "http://REMOTE_HOST/names.json"
        select: (event,ui) -> $("user_friend_name_id").val(ui.item.value)
})
0
toegevoegd