2010-07-28 4 views
8

Użyłem jquery-ui do automatycznego uzupełnienia pola wprowadzania i ustawienia ukrytej wartości z wybranego elementu.Autouzupełnianie jquery-ui nie jest wybierane przy wprowadzaniu

Zrobiłem to za pomocą opcji

select: function(event, ui) { ...$("#myDiv").val(ui.item.value)... } 

(może być źle teraz, nie mają kodu pod ręką, ale działa aż do mojego pytania ...)

To działa, gdy wybierz pozycję z menu za pomocą myszy, jednak jeśli po prostu wprowadzę jakiś tekst i wybiorę element za pomocą Enter - nic nie zrobię, to tak, jakby funkcja wyboru nie była w ogóle uruchamiana przez funkcję autouzupełniania. Jednak użycie tabulatora poza polem wyzwala zaznaczenie.

Użyłem fokusu i zmiany: aby również zaktualizować pola, które chcę, ale myślę, że to przesada, jeśli naprawdę konieczne jest określenie wszystkich fokusów, zmiana i wybór, aby mieć pewność, że użytkownik wybiera pozycję z listy, która zostanie wybrana.

Dziękuję.

rofly: Używam autouzupełniania jQuery-UI, ma kod dajesz, ale wygląda to tak (od jquery.ui.autocomplete.js)


case keyCode.ENTER: 
       case keyCode.NUMPAD_ENTER: 
        // when menu is open or has focus 
        if (self.menu.active) { 
         event.preventDefault(); 
        } 
        //passthrough - ENTER and TAB both select the current element 
       case keyCode.TAB: 
        if (!self.menu.active) { 
         return; 
        } 
        self.menu.select(event); 
        break; 

który wygląda wszystko dandys, więc nie jestem pewien, czy to się nie uda z tego powodu.

Mój kod to tak (zawinięte w document.read()

$("#someDiv").attr("autocomplete", 'off'); 
$("#someDiv").autocomplete({ 
source: function(request, response) { 
if (request.term in cache) { 
response(cache[ request.term ]); 
return; 
} 
$.ajax({ 
url: "giveMeJSON.jsp", 
dataType: "json", 
data: request, 
success: function(data) { 
cache[ request.term ] = data; 
response(data); 
} 
})}, 
minLength: 1, 
delay: 300, 
select: function(event, ui) { 
$("#someDiv").val(ui.item.label); 
$("#hiddenDiv").val(ui.item.value); 
} 
});

tak, problem jest, to działa, gdy użytkownik jest wybranie z menu z myszą i kiedy tabbing z pola (keyUp, keyDown do wyboru, tab out, działa), ale keyUp, keyDown, aby go wybrać, a następnie wpisz, i nic się nie stanie!

+0

jeśli ustawić ukryte wejście ma dziwny id 'myDiv' .... może' Zmiana funkcji (zdarzenie, ui) {... $ ("# myDiv"). val (ui.item.value) ...} 'works – Ties

Odpowiedz

6

Podobna instancja działa dla mnie z jQuery 1.4.2 i jQuery-ui 1.8.7. Jedna uwaga, Enter wydaje się działać tylko przy wybieraniu pozycji z listy Jeśli tworzysz nowy wpis, który nie istnieje, naciśnięcie Enter nie wyzwoli wyboru lub zmiany wydarzeń. ind oddzielny moduł obsługi zdarzeń, aby ta sytuacja się poprawiła.

+1

Oto dokładny kod, którego używam do przechwytywania klawisza Enter. $ ("# YourAutoComplete") przyciśnięcie (function (e) { \t if (e.which == 13) { yourFunction ($ ('# yourAutoComplete') val());.. return false;} \t \t} Mam nadzieję, że to pomoże! – JeffSea

+0

Zobacz odpowiedź @iamct! Autofokus sprawia, że ​​pierwszy element ma fokus, a tym samym klawisz Enter wybiera go! –

2

To działało dla mnie, gdy przesyłałem formularz po automatycznym wypełnieniu.

$("input#searchbox").autocomplete({ 
    source: autocomplete, 
    select: function(event, ui) { } 
    $("input#searchbox").val(ui.item.value); 
    $("#searchform").submit(); 
    } 
}) 

Od Search on Click with Jquery's Autocomplete