jQuery UI autouzupełnianie: wymusić wybór z listy bez zmian

Question

Używam zwyczaj wiązania przewidziane w Autocomplete combobox with Knockout JS template/JQuery

muszę egzekwować, że użytkownik musi wybrać wartość z listy autouzupełniania i po ich wybrać wartość nie być możliwość dodania dodatkowego tekstu do zaznaczenia. Przeszukałem, ale nie mogę znaleźć przykładu, jak zapobiec wprowadzaniu dodatkowego tekstu. Musi pozostać edytowalny, jeśli wybrano niewłaściwe rozwijanie, ale to, co wpisują, musi odpowiadać 100% wartości z listy.

Znalazłem this zamieszczam na jquery ale jej 9 miesięcy i nikt nie opublikował odpowiedzi.

Answer 1

Nie ma wbudowanej funkcji do robienia tego, co chcesz.

Zrobiłem prosty projekt, w którym przy użyciu zdarzenia autouzupełniania change należy wybrać wartość z autouzupełniania, jeśli nie, wartość zostanie usunięta.

Zmień wydarzenie

wyzwalane, gdy pole jest zamazany, jeżeli wartość uległa zmianie.

Po selekcji pole zostało wyłączone i można je aktywować za pomocą kotwicy aktywującej (na przykład).

Kod:

$("#artist").autocomplete({ 
    source: function (request, response) { 
     $.ajax({ 
      url: "http://en.wikipedia.org/w/api.php", 
      dataType: "jsonp", 
      data: { 
       'action': "opensearch", 
        'format': "json", 
        'search': request.term 
      }, 
      success: function (data) { 
       response(data[1]); 
      } 
     }); 
    }, 
    change: function (event, ui) { 
     if (ui.item == null || ui.item == undefined) { 
      $("#artist").val(""); 
      $("#artist").attr("disabled", false); 
     } else { 
      $("#artist").attr("disabled", true); 
     } 
    } 
}); 

$('#changeArtist').click(function (e) { 
    e.preventDefault(); 
    $("#artist").attr("disabled", false); 
}); 

Oto skrzypce: http://jsfiddle.net/IrvinDominin/nH4Nx/

Answer 2

Jest to starszy post, ale myślę, że to łagodnie niepełna z perspektywy UX, ze względu na problem ostrości (nie dokonać zmiany, dopóki nacisk zostanie usunięty z wejścia, w tym przypadku „#artist”, dość irytujące), więc chciałbym dodać:

select: function (event, ui) { 
     $("#artist").attr("disabled", false); 
    } 

tak (załóżmy, że jest to przycisk próbujemy pl stanie), że użytkownik widzi włączony obiekt natychmiast po wyborze.