Nån som är en fena på jQuery UI autocomplete?

bassebhuMedlem sedan nov. 20016 480 inlägg

Frågan14 juni 2014 16:41#1

Hej!

Jag använder jQuery autocomplete och det funkar utmärkt, men i stället för att värdet hamnar i textboxen när man klickar så skulle jag vilja skapa nya divar/li:s nedanför textboxen där värdena dyker upp. Så textfältet blir lite som att söka poster att skapa divar av i stället för autocomplete.

Ta gärna en titt på demon på sidan. Skillnaden är att jag hämtar resultaten med ajax, men det borde bli detsamma vad som händer när man klickar på ett sökresultat. Idéer?

Det här är min js-kod. Nånstans inne i "select:" tänker jag att man kan lägga till lite jQuery-kod:

$(function() {
 
    $("#autocomplete").autocomplete({
        source: "js/autocomplete/ajax_autocomplete.php",
        minLength: 2,
        select: function(event, ui) {
            var url = ui.item.id;
            /*if(url != '#') {
                location.href = url;
            }*/
        },
 
        html: true, // optional (jquery.ui.autocomplete.html.js required)
 
      // optional (if other layers overlap autocomplete list)
        open: function(event, ui) {
            $(".ui-autocomplete").css("z-index", 1000);
        }
    });
});

Jag kan fixa jQuery-koden själv för att skapa divarna, jag måste bara ha lite hjälp med hur jag får ut värdena från autocompleten och förhindrar att den uppdaterar inputfältet. Lite som att stänga av scriptets huvudfunktion, men allt övrigt funkar som jag vill så det borde som sagt inte vara supersvårt att få till.

Tack!

bassebhuMedlem sedan nov. 20016 480 inlägg

14 juni 2014 16:48#2

Ok, jag tror att jag precis kom på att det här var ganska enkelt. Inne i selecten kan jag göra precis vad jag vill. Det enda som återstår är att förhindra autocomplete att ersätta texten i inputfältet. Hur gör jag det? Även det i select-blocket?

select: function(event, ui) {
            var id = ui.item.id;
            $('#div').append(id); // kan göra vad jag vill här
        },

// Edit.... För att förtydliga. Kolla in demon på autocomplete-sidan. När man klickar på en "tag" vill jag att inget ska uppdateras i inputfältet. No autocomplete :) Tack!