おそらく最悪の質問ですが、他にどのように表現すればよいかわかりません。
基本的に、jQuery tag-itをコードに実装しました。ただし、別のユーザーからのソリューションを使用しています。これは、必要なデータをプルして必要な入力にダンプする限り機能します。
したがって、私が得た解決策は次のとおりです。
jQuery:
$(document).ready(function(){
var availableTags = <?php include("ajax-search.php"); $english = search();?>;
$("#livesearch").tagit({
autocomplete: {
source: availableTags
}
});
});
PHP/MySQLi:
function search() {
include("dbconnect.php"); //Including our DB Connection file
$sql = "SELECT * FROM animals";
$query = mysqli_query($db, $sql);
while ($result = mysqli_fetch_assoc($query)){
$english[] = $result['eng_names'];
}
echo json_encode($english);
}
基本的に、3 つの変数を返したいと考えています。英語、ラテン語、ステータス。
したがって、前提は次のとおりです。
Status = English == Latin
したがって、ステータスには、絶滅、絶滅危惧種、野生絶滅などがあります。ただし、これらのリストのいずれにも含まれていない動物もいます。これらの動物はありふれている可能性があるため、特別なラベルは必要ありませんが、すべてラテン語の名前が必要です。
目的は、ユーザーが「Extinct」と入力すると、死んだすべての動物のリストが表示されることです。
タグを使用する理由 まあ、それらはレポートだからです。ユーザーはレポートを作成し、それらに関与する動物にタグを付けます。動物の名前 (ラテン語と英語) を返す必要がありますが、ステータスは返しません。
jsonがこれを行う方法を理解していると思います。それらを追加するだけです。フィールドのステータス列にテキストがない場合は、無視してください。しかし、mysqli検索から返す方法がわかりません。メソッドは .map() だと思いますが、.map() を使用するたびに検索機能が壊れます (すべてのクリーチャーがリストされますが、入力しても検索が集中しません.
編集:
喜び。それで、私は混乱していた2つのパラメータを一致させる方法を理解することができました.
元のjQueryを変更してこれを行いました:
<script>
$(document).ready(function(){
$("#livesearch").tagit({
autocomplete: {
source: 'ajax-search.php',
minLength:1
}
});
});
</script>
次に、HTML に post メソッドを追加しました。
<form method="post">
<input name="tags" id="latin" size="100%" disabled="true">
<ul id="livesearch"></ul>
<input type="submit" value="Submit" />
</form>
ただし、検索はすべて PHP/MySQLi クエリで行われます。
if ( !isset($_REQUEST['term']) )
exit;
$keyword = trim($_REQUEST['term']);
$keyword = mysqli_real_escape_string($db, $keyword);
$query = "SELECT * FROM animals WHERE english LIKE '%$keyword%' OR status LIKE '%$keyword%'";
$result = mysqli_query($db, $query); //Run the Query
$data = array();
if ($result && mysqli_num_rows($result)){
while($row = mysqli_fetch_assoc($result)){
$data[] = array(
'label' => $row['english'],
'value' => $row['english'],
'latin' => $row['latin']
);
}
}
echo json_encode($data);
flush();
したがって、ステータス (絶滅、絶滅危惧種など) を検索すると、正しい動物が返されます。
私はこれらの人からアイデア/コードを得ました。
そのため、ラテン語と英語を 2 つの異なるフィールドで表示する必要がある部分に行き詰まっていますが、tag-it.js ソースをいじる必要があると考えています。わかり次第更新します。
編集2:
さて、2 つの異なる結果を 2 つの異なるテキスト フィールドに入れることで、なんとか動作させることができました。ただし、タグへの入力は閉じません。
変更された jQuery は次のとおりです。
$("#livesearch").tagit({
autocomplete: {
source: "ajax-search.php",
select: function(evt, ui){
this.form.latin.value = ui.item.latin;
}
}
});
ラテン語をラテン語のテキスト入力に入れるという点で機能します。ただし、以前のように、入力をきちんとした小さなタグにラップすることはなくなりました。
編集 3
私はできる限り行ったが、役に立たなかった。
基本的に、autocomplete フィールドを次のように拡張して、tag-it.js 自体に変数呼び出しを追加しました。
// Autocomplete.
if (this.options.availableTags || this.options.tagSource || this.options.autocomplete.source) {
var autocompleteOptions = {
select: function(event, ui) {
that.createTag(ui.item.value);
that.createTag(ui.item.latin); //custon input?
// Preventing the tag input to be updated with the chosen value.
return false;
}
};
$.extend(autocompleteOptions, this.options.autocomplete);
ただし、動物の通常の英語名と動物のラテン語名の両方を同時に追加するだけです. 後で英語の名前を削除できますが、それは長すぎます。
動作しているように見えるを使用しようとしましたthis.form.latin.value = ui.item.latin;
が、多数のタグを追加したり、タグを削除したりすると、コード全体が壊れます。それは一方通行のように見えるので、それは素晴らしい解決策ではありません。