入力中に提案を表示する入力フィールドを実現しようとしています。私はjqueryオートコンプリート関数を見つけましたが、私はPHPのデータソースとしてXMLに苦労しています。私のPHPファイルは、このような出力を作成します。xmlをデータソースとして出力するPHPでオートコンプリート
XML:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<locations>
<location>
<number>600</number>
<name>Location Name 600</name>
</location>
<location>
<number>698</number>
<name>Location Name 698</name>
</location>
<location>
<number>1110</number>
<name>Location Name 1110</name>
</location>
</locations>
私はロリーMcCrossanにより投稿されたリンクでそれを試してみました。
私のHTMLは次のようになります。私は、入力フィールドに何かを書くとき
<!DOCTYPE HTML>
<head>
<title>Autocomplete</title>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<script type="text/javascript">
$(function() {
function log(message) {
$("<div/>").text(message).prependTo("#output");
$("#output").scrollTop(0);
}
$.ajax({
url: "api.php",
dataType: "xml",
success: function(xmlResponse) {
var data = $("location", xmlResponse).map(function() {
return {
name: $("name", this).text(),
number: $("number", this).text()
};
}).get();
$("#locations").autocomplete({
source: data,
minLength: 0,
select: function(event, ui) {
log(ui.item ?
"Selected: " + ui.item.name + ", number: " + ui.item.number :
"Nothing selected, input was " + this.value);
}
});
}
});
});
</script>
</head>
<body style="background-color: black; color: white;">
<input id="locations" />
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
Result:
<div id="output" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>
</body>
</html>
、それそれから明確な、それは私が持っている場所の量である(3李の入力フィールドの下に私を示してい、xmlによると)、テキストは表示されません。何がうまくいかないの?
これはxmlファイルの代わりにurl: "api.php"でも使用できますか? – Ahatius
はい、期待するフォーマットをXMLに明示的に設定するために 'dataType:" xml "の設定を含める限りです。 –
オートコンプリートの方法に問題があります。投稿を開くをご覧ください。 – Ahatius