2010-06-01 2 views
2

jquery-ui 자동 완성 예제를 얻으려고 노력했습니다. 쿼리를 처리 할 수있는 컨트롤러가 설치되어 있고 순서에 따라 보이는 json을 반환하지만 제안 표시가 나타나지 않습니다. 여기jquery-ui 자동 완성 (ASP 포함) MVC 제안이 표시되지 않습니다.

<script type="text/javascript" language="javascript" src="/Scripts/jquery-1.4.1.js"></script> 

<script type="text/javascript" language="javascript" src="/Scripts/jquery-ui-1.8.1.custom.min.js"></script> 

<link href="/Content/jquery-ui-1.8.1.custom.css" rel="stylesheet" type="text/css" /> 

및 자바 스크립트와 양식 태그입니다 :

<script type="text/javascript"> 
    $(function() { 

     $("#organization").autocomplete({ 
      source: function (request, response) { 
       $.ajax({ 
        url: '/Organization/OrganizationLookup', 
        dataType: "json", 
        data: { 
         limit: 12, 
         q: request.term 
        } 
       }) 
      }, 
      minLength: 2 
     }); 
    }); 
</script> 

<div class="ui-widget"> 
    <label for="organization">Organization: </label> 
    <input id="organization" /> 
</div> 

내가 내 컨트롤러에서 합리적인 보이는 JSON 응답 돌아갈 여기

내가 포함하고있는 JS 라이브러리입니다 :

[ 
    { 
    "id":"Sector A", 
    "value":"Sector A" 
    }, 
    { 
    "id":"Sector B", 
    "value":"Sector B" 
    }, 
    { 
    "id":"Sector C", 
    "value":"Sector C" 
    } 
] 

자동 완성이 찾고있는 기본 이름 인 것처럼 보입니다. 를 위해.

그러나 나는 전혀 기쁨을 얻지 못합니다. 이견있는 사람?

답변

4

여기에 문제가 없습니다 - 자바 스크립트 앞에 CSS를 넣어야합니다. 항상.

반환 값은 아무 것도하지 않습니다. 콜백 함수를 사용하여 데이터를 가져 와서 데이터를 처리해야합니다. ("성공 :"매개 변수, 나는 믿는다). 호건의 제안에

+0

네 말이 맞아! 필자는 json이 데이터 구조와 일치하도록하기 위해 노력했으나 매핑을 할 필요가 없다고 생각했습니다. (이전에 좀 더 복잡한 매핑을 시도했기 때문에 초기에 실패했습니다.) 내가 읽었던 다른 문서는 ID/값 또는 레이블/값이 예상되지만 그게 작동하지 않는다고 말했습니다 ... – adamnickerson

+0

nice, drat those blind alleys – Hogan

2

덕분에, 나는 성공 매개 변수에 다음 콜백 함수를 추가, 나는 갈 수 있었다 :

success: function (data) { 
          response($.map(data, function (item) { 
           return { 
            label: item.label, 
            value: item.value 
           } 
          })) 
관련 문제