드롭 다운에서 옵션을 선택하면 jQuery 자동 완성 기능이 작동하지 않습니다.

크리스티안 로하스

처음에는 완벽하게 작동하는 자동 완성을 수행하기 위해 jQuery typeahead를 사용하고 있지만 목록에서 옵션을 선택한 다음 다시 사용하려고하면 (입력을 입력하여) 결과가 다시 표시되지 않습니다.

옵션을 선택하면 자동 완성 기능이 파괴되는 것 같습니다.

업데이트 # 1

무슨 일이 일어나고 있는지 볼 수 있도록 jsfiddle을 만들었습니다. 입력에 "someone"을 입력하여 자동 완성 된 데이터를 얻을 수 있습니다. http://jsfiddle.net/cristiangrojas/rhtd9o8k/3/

var Opportunities = new Bloodhound({
  datumTokenizer: function(d) {
    return Bloodhound.tokenizers.whitespace(
      '{id} {name} {identification} {email} {vehicle_registration}'.assign({
        "id": d["id"],
        "name": d["name"],
        "identification": d["identification"],
        "email": d["email"],
        "vehicle_registration": d["vehicle_registration"]
      })
    );
  },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  local: opportunities
});

Opportunities.initialize();

$('input[name="opportunities_search"]').typeahead({
  hint: true,
  highlight: true,
  minLenght: 1
}, {
  name: 'oportunidades',
  displayKey: 'id',
  source: Opportunities.ttAdapter(),
  templates: {
    empty: [
      '<div class="empty-message">',
      'No se encontró ninguna oportunidad',
      '</div>'
    ].join('\n'),
    suggestion: Handlebars.compile(
        '<p>' +
        'Opp #{{ id }}' +
        '<br>' +
        '{{ name }}' +
        '<br>' +
        'CC: {{ identification }}' +
        '<br>' +
        'email: {{ email }}' +
        '<br>' +
        'Placa: {{ vehicle_registration }}' +
        '</p>'
    )
  }
});
Rel

문서에서 :

https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md

displayKey – 주어진 제안 객체에 대해 문자열 표현을 결정합니다. 제안을 선택한 후 입력 컨트롤의 값을 설정할 때 사용됩니다. 제안 개체를 문자열로 변환하는 키 문자열 또는 함수일 수 있습니다. 기본값은 값입니다.

'id'의 키 문자열을 사용하고 있지만 id에 대한 json 데이터는 문자열이 아닙니다. 따라서 json 데이터를 변경하여 ID를 문자열로 사용하거나 함수를 사용하여이 바이올린에서와 같이 ID를 문자열로 반환합니다.

displayKey: function(d){return d.id+'';},

http://jsfiddle.net/rhtd9o8k/19/

어디 d제안 객체가 돌려과 id 속성에 빈 문자열을 추가하는 것은 자바 스크립트에서 숫자를 문자열로 캐스팅 할 수있는 쉬운 방법입니다.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

jQuery 자동 완성 기능이 작동하지 않습니다.

분류에서Dev

드롭 다운에서 선택하지 않고 jquery 자동 완성 수락

분류에서Dev

드롭 다운에서 jQuery 속성 선택이 작동하지 않음 Mac Safari

분류에서Dev

드롭 다운을 클릭하여 jquery에서 행 생성이 작동하지 않습니다.

분류에서Dev

자동 완성 기능이 드롭 다운에 텍스트를 표시하지 않습니다.

분류에서Dev

드롭 다운 목록에 표시되지만 상자에 색상이 지정되지 않은 옵션 텍스트 색상을 선택합니다.이 옵션은 즉 9에서는 작동하지만 크롬에서는 작동하지 않습니다.

분류에서Dev

jQuery 드롭 다운 선택됨 = Safari에서 선택이 작동하지 않음

분류에서Dev

Jquery 자동 완성이 작동하지 않습니다.

분류에서Dev

Jquery 자동 완성이 작동하지 않습니다.

분류에서Dev

jQuery 자동 완성 양식이 작동하지 않습니다.

분류에서Dev

jQuery 복제 된 django-selectable 자동 완성 드롭 다운이 작동하지 않음

분류에서Dev

서버에서 드롭 다운 항목 선택을 기다릴 때 jeditable의 loadtext 속성이 작동하지 않는 것 같습니다.

분류에서Dev

드롭 다운에서 자동 완성이 작동하도록하고 다른 드롭 다운의 내용을 채우도록합니다.

분류에서Dev

jQuery 자동 완성 기능이 작동하지 않습니까?

분류에서Dev

jquery onchange 선택 옵션이 작동하지 않습니다.

분류에서Dev

jQuery 자동 완성이 Rails 4에서 작동하지 않습니다.

분류에서Dev

드롭 다운에서 특정 옵션을 선택하면 jquery 함수 실행

분류에서Dev

Oracle APEX에서 자동 완성 기능을 사용하여 텍스트 필드에 드롭 다운 추가

분류에서Dev

Jquery 자동 완성은 Jsfiddle에서 작동하지만 페이지에서는 작동하지 않습니다.

분류에서Dev

자동 점프 자동 완성 기능이 작동하지 않습니다.

분류에서Dev

Angular 8에서 자동 완성을 열 때 옵션을 스크롤하는 방법-편집 가능한 드롭 다운

분류에서Dev

셀레늄 웹 드라이버에서 자동 완성 드롭 다운 선택

분류에서Dev

마젠 토의 드롭 다운에서 옵션을 선택한 후 구성 가능한 제품 가격이 자동으로 변경되지 않음

분류에서Dev

선택한 옵션이 jQuery에서 작동하지 않습니다.

분류에서Dev

드롭 다운 메뉴에서 옵션을 선택하기 위해 셀레늄 코드를 얻으려고하지만 작동하지 않음 (Google 양식)

분류에서Dev

AngularJS 드롭 다운-자동 선택이 작동하지 않음

분류에서Dev

자동 완성 드롭 다운에서 선택한 값 가져 오기

분류에서Dev

드롭 다운 목록에서 옵션을 선택하면 자동으로 결과 표시

분류에서Dev

jQuery는 특정 옵션을 선택 상단으로 이동 (드롭 다운)

Related 관련 기사

  1. 1

    jQuery 자동 완성 기능이 작동하지 않습니다.

  2. 2

    드롭 다운에서 선택하지 않고 jquery 자동 완성 수락

  3. 3

    드롭 다운에서 jQuery 속성 선택이 작동하지 않음 Mac Safari

  4. 4

    드롭 다운을 클릭하여 jquery에서 행 생성이 작동하지 않습니다.

  5. 5

    자동 완성 기능이 드롭 다운에 텍스트를 표시하지 않습니다.

  6. 6

    드롭 다운 목록에 표시되지만 상자에 색상이 지정되지 않은 옵션 텍스트 색상을 선택합니다.이 옵션은 즉 9에서는 작동하지만 크롬에서는 작동하지 않습니다.

  7. 7

    jQuery 드롭 다운 선택됨 = Safari에서 선택이 작동하지 않음

  8. 8

    Jquery 자동 완성이 작동하지 않습니다.

  9. 9

    Jquery 자동 완성이 작동하지 않습니다.

  10. 10

    jQuery 자동 완성 양식이 작동하지 않습니다.

  11. 11

    jQuery 복제 된 django-selectable 자동 완성 드롭 다운이 작동하지 않음

  12. 12

    서버에서 드롭 다운 항목 선택을 기다릴 때 jeditable의 loadtext 속성이 작동하지 않는 것 같습니다.

  13. 13

    드롭 다운에서 자동 완성이 작동하도록하고 다른 드롭 다운의 내용을 채우도록합니다.

  14. 14

    jQuery 자동 완성 기능이 작동하지 않습니까?

  15. 15

    jquery onchange 선택 옵션이 작동하지 않습니다.

  16. 16

    jQuery 자동 완성이 Rails 4에서 작동하지 않습니다.

  17. 17

    드롭 다운에서 특정 옵션을 선택하면 jquery 함수 실행

  18. 18

    Oracle APEX에서 자동 완성 기능을 사용하여 텍스트 필드에 드롭 다운 추가

  19. 19

    Jquery 자동 완성은 Jsfiddle에서 작동하지만 페이지에서는 작동하지 않습니다.

  20. 20

    자동 점프 자동 완성 기능이 작동하지 않습니다.

  21. 21

    Angular 8에서 자동 완성을 열 때 옵션을 스크롤하는 방법-편집 가능한 드롭 다운

  22. 22

    셀레늄 웹 드라이버에서 자동 완성 드롭 다운 선택

  23. 23

    마젠 토의 드롭 다운에서 옵션을 선택한 후 구성 가능한 제품 가격이 자동으로 변경되지 않음

  24. 24

    선택한 옵션이 jQuery에서 작동하지 않습니다.

  25. 25

    드롭 다운 메뉴에서 옵션을 선택하기 위해 셀레늄 코드를 얻으려고하지만 작동하지 않음 (Google 양식)

  26. 26

    AngularJS 드롭 다운-자동 선택이 작동하지 않음

  27. 27

    자동 완성 드롭 다운에서 선택한 값 가져 오기

  28. 28

    드롭 다운 목록에서 옵션을 선택하면 자동으로 결과 표시

  29. 29

    jQuery는 특정 옵션을 선택 상단으로 이동 (드롭 다운)

뜨겁다태그

보관