jquery easy autocomplete url関数

私はjquery easy autocompleteを使って作業する上で助けを得たいと思っています。私は、javascript xmlrpc関数を持つHTMLページを呼び出すurl関数を作成しようとしていて、json形式の名前のリストを返します。 Webコンソールに表示されるのは、次のとおりです。警告：応答データを読み込めません。jquery easy autocomplete url関数

照会ページ：

<html> 
<script src="./js/jquery-3.1.1.min.js" type="text/javascript" ></script> 
<script src="./js/jquery.xmlrpc.js" type="text/javascript" ></script> 
<body> 

<p id="display"></p> 
</body> 

<script> 
$(document).ready(function() { 
    var url = "https://url.to.my.api/nameapi"; 
    $.xmlrpc({ 
     url: url, 
     methodName: 'API.FullNameQuery', 
     success: function(response, status, jqXHR) { 
      var resp = response + ''; 
      document.getElementById('display').innerHTML = resp; 
     }, 
      error: function(jqXHR, status, error) { console.log("Error getting information:" + error) } 
    }); 
}); 
</script> 
</html>

簡単オートコンプリートのページ：

<html> 
<script src="./js/jquery-3.1.1.min.js" type="text/javascript" ></script> 
<script src="./js/jquery.easy-autocomplete.min.js"></script> 
<link rel="stylesheet" href="css/easy-autocomplete.min.css"> 
<link rel="stylesheet" href="css/easy-autocomplete.themes.min.css"> 
<body> 

<input id="inputOne" placeholder="Full Name" /> 
<input id="inputTwo" placeholder="netID" /> 
</body> 

<script> 
$(document).ready(function() { 
var resp; 
var options = { 
    url: function(phrase) { 
     return phrase !== "" ? 
"https://url.to.my.api/get-people.html" : 
"https://url.to.my.api/get-people.html"; 
    }, 

    getValue: "fullName", 
    ajaxSettings: { 
     dataType: "json" 
    }, 
    requestDelay: 300, 
    theme: "blue-light", 
    list: { 
     maxNumberOfElements: 200, 
     match: { 
      enabled: true 
     } 
    } 
}; 
$("#inputOne").easyAutocomplete(options); 
}); 
</script> 
</html>

これは、IISサーバー上でホストされている、および実施例は簡単にオートコンプリートのために示したように私はPHPを使用することはできません。私はそれを検証したので、ページは適切なjsonを返します。だから私はそれが好きではないと少し混乱しています。

出典

2017-05-08 user7242751

私が正しく理解すれば、私は同じ問題を抱えていました。

データの配列を1回だけにロードしたかったのですが、これはオートコンプリートの仕組みが簡単ではありません。 URLを使用すると、手紙を入力すると要求が行われます。

1）：設定を読み込む簡単にオートコンプリート機能を作成します（再利用可能であるドープ）：

function autoComplete(data_src) { 
    return { 
     data: loadManufacturer(data_src), 
     getValue: "name", 
     theme: "bootstrap", 
     list: { 
      match: { 
       enabled: true 
      }, 
      showAnimation: { 
       type: "fade", //normal|slide|fade 
       time: 200, 
       callback: function() {} 
      }, 

      hideAnimation: { 
       type: "slide", //normal|slide|fade 
       time: 200, 
       callback: function() {} 
      } 
     } 
    }; 
}

2）：VARで件のデータを保管し

function loadManufacturer(url) { 
    var tmp = null; 
    $.ajax({ 
     'async': false, 
     'type': "GET", 
     'global': false, 
     'dataType': 'json', 
     'url': url, 
     'success': function (data) { 
      tmp = data; 
     } 
    }); 
    return tmp; 
}

3）コールあなたの入力機能：

$("#search_product_manufacturer").easyAutocomplete(
     autoComplete(
       $("#search_product_manufacturer").attr('data-src') 
       ) 
     );

出典

2017-09-28 17:55:39 Wiwwil

jquery easy autocomplete url関数

答えて

関連する問題