2015-01-15 3 views
0

Jquery 플러그인 자동 완성으로 데이터를 검색하는 데 문제가있었습니다. 이 내 예입니다CloudSearch Amazon 및 Jquery 자동 완성을 구현하려면 어떻게해야합니까?

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Autocomplete - Remote JSONP datasource</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
    <!-- <link rel="stylesheet" href="/resources/demos/style.css"> --> 
    <style> 
    .ui-autocomplete-loading { 
    background: white url("images/ui-anim_basic_16x16.gif") right center no-repeat; 
    } 
    #city { width: 25em; } 
    </style> 
    <script> 
    $(function() { 
    function log(message) { 
     $("<div>").text(message).prependTo("#log"); 
     $("#log").scrollTop(0); 
    } 

    $("#city").autocomplete({ 
     source: function(request, response) { 
     //$.getJSON('/http://search-profuturo-iiwjjl6diqb7gluv2inqunahea.us-west-2.cloudsearch.amazonaws.com/2013-01-01/search?', { q: request.term }, function(data){ response(data); }); 


     $.ajax({ 
      url: "http://search-DOMAIN-iiwjjl6diqb7gluv2inqunahea.us-west-2.cloudsearch.amazonaws.com/2013-01-01/search?", 
      dataType: "jsonp", 
      data: { 
      q: request.term 
      }, 
      success: function(data) { 
      response(data); 
      } 
     }); 

     }, 
     minLength: 3, 
     select: function(event, ui) { 
     log(ui.item ? 
      "Selected: " + ui.item.label : 
      "Nothing selected, input was " + this.value); 
     }, 
     open: function() { 
     $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); 
     }, 
     close: function() { 
     $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); 
     } 
    }); 
    }); 
    </script> 
</head> 
<body> 

<div class="ui-widget"> 
    <label for="city">Your city: </label> 
    <input id="city"> 
</div> 

<div class="ui-widget" style="margin-top:2em; font-family:Arial"> 
    Result: 
    <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div> 
</div> 


</body> 
</html> 

그리고 이것은 응답입니다 :

오류입니다
&callback=jQuery11020041068303398787975_1421364823901 

, 해당 문자열이 모든 necesary되지 않습니다 :

http://search-DOMAIN-iiwjjl6diqb7gluv2inqunahea.us-west-2.cloudsearch.amazonaws.com/2013-01-01/search?&callback=jQuery11020041068303398787975_1421364823901&q=starwars&_=1421364823902 

이 모든 문자열을 추가합니다.

나는 이런 식으로 URL을해야합니다

http://search-DOMAIN-iiwjjl6diqb7gluv2inqunahea.us-west-2.cloudsearch.amazonaws.com/2013-01-01/search?q=starwars 

와 나는 JSON 응답을해야합니다.

어떻게하면됩니까?

+0

은 올바른 요청 URL이? 또한 귀하의 응답으로 URL을 가져서는 안됩니다. JSON 데이터를 다시 가져와야합니다. – Rafael

답변

0

는 시도이

$.ajax({ 
    url: 'http://search-DOMAIN-iiwjjl6diqb7gluv2inqunahea.us-west-2.cloudsearch.amazonaws.com/2013-01-01/search', 
    data: { 
     q: 'starwars' 
    } 
    jsonp : false, 
    jsonpCallback: 'jsonCallback', 
    cache: 'true', 
    dataType: 'jsonp' 
}); 

function jsonCallback(data) { 
    console.log(data); 
} 
+0

amazon의 문서에 따라 작동하려면 API 버전/2013-01-01을 추가해야합니다.하지만 말은하지 만 여전히 작동하지 않습니다. 여전히 잘못된 요청을받습니다. 감사합니다 –

+0

당신은 귀하의 도메인 이름과 도메인 ID가 맞습니까? 정확한 위치 (서쪽)? – Rafael

+0

나는 당신을 도와주고 싶지만 당신은 토론에 열중하지 않습니다. – Rafael