1
Ajaxオートコンプリートを使用してテーブル行をビルドする方法を教えてください。オートコンプリートコードが動作しています。ユーザーが値を検索し、どれをクリックしたら、その値を自分のテーブルに追加したいのですか？彼らが再び検索する場合、その結果を最初の結果の下に追加したいと思います。私は応答からテーブルの行を構築する方法を見つけることができません。ここにコードがあります。AjaxとjQueryオートコンプリートを使用してAjaxレスポンス（Json）からテーブル行を作成する
もう一つ、私は息子のファイルを読んでいます：
これは、私はいくつかのことを期待していた私のAjax、jQueryのコード
$.support.cors = true;
$(document).ready(function ($) {
var items = [];
$("#addclass").autocomplete({
source: function (request, response) {
var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
$.ajax({
url: "php/Classes.php",
dataType: "json",
beforeSend: function() {
$("#search-box").css("background","#C0C0C0");
},
success: function (data) {
response($.map(data, function (value, i) {
var text = value.value;
if (text && (!request.term || matcher.test(text))) {
return {
ID: value.ID,
value: value.value
};
}
}));
}
});
}
});
});table, th, td {
margin: 0% 0px 0px 20%;
border: 1px solid black;
border-collapse: collapse;
border-spacing: 15px 0px;
}
th, td {
padding: 4px 10px 4px 10px;;
text-align: center;
}
This is my HTML code<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/profile.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://use.fontawesome.com/a8b13015aa.js"></script>
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<script>tinymce.init({selector: '#tinymce'});</script>
<script type="text/javascript" src="script/profile.js"></script>
<script type="text/javascript" src="plugin/tinymce/tinymce.min.js"></script>
<script type="text/javascript" src="plugin/tinymce/init-tinymce.js"></script>
<script src="script/profile.js"></script>
</head>
<body>
<div class="info">
<label id ="classes">My Classes</label>
<table class = "table">
<p></p>
<tr>
<th>Course ID</th>
<th>Course Name</th>
<th>Start Date/End Date</th>
<th>Credit Hours</th>
</tr>
</table>
<br>
<label id ="activity">HIGHT AND ACTIVITY</label>
<label id = "search"><input type="text" name="addclass" id="addclass" placeholder="Search for course"/></label>
<div id ="suggesstion"></div>
<label></label>
</div>
</section>
</body>
</html>です私を助けることができた。