Вывод информации в соответствующие поля ввода
Требуется реализовать вставку в поля ввода отталкиваясь от названия (title).
Когда ввожу какое-нибудь название, под полем ввода появляются варианты, кликаю на какой-нибудь, и он подставляется в поле ввода. Требуется сделать, чтобы при клике на какой-либо из вариантов подставлялась информация и в другие поля ввода, помимо названия.
entry.php
<script>
$(document).ready(function() {
$('#title').on('input', function() {
var search = $(this).val();
if (search != '') {
$.ajax({
url: '../vendor/search.php',
method: 'POST',
data: {
search: search
},
success: function(response) {
$('#title_list').html(response);
$('#title_list').fadeIn();
}
});
} else {
$('#title_list').fadeOut();
}
});
$(document).on('click', '.title_item', function() {
var title = $(this).text();
$('#title').val(title);
$('#title_list').fadeOut();
var author = '<?php echo $row['author']; ?>';
var publicationType = '<?php echo $row['publicationType']; ?>';
$('select[name="publicationtype"]').val(publicationType);
$('input[name="author"]').val(author);
});
});
if (search != '') {
$.ajax({
url: '/vendor/search.php',
method: 'POST',
data: {
search: search
},
success: function(response) {
$('#title_list').fadeIn();
$('#title_list').html("");
var titles = JSON.parse(response);
for (let i = 0; i < titles.length; i++) {
const $titleItem = $("<div class='title_item'>" + titles[i] + "</div>").click(titleSelect.bind(null, titles[i], author, publicationType));
$('#title_list').append($titleItem);
}
}
});
function titleSelect(title, author, publicationType) {
$('#title').val(title);
$('#title_list').fadeOut();
$('select[name="publicationtype"]').val(publicationType);
$('input[name="author"]').val(author);
}
var delay = 500;
var timeoutId;
$('#title').keyup(function() {
clearTimeout(timeoutId);
timeoutId = setTimeout(function() {
var search = $('#title').val();
}, delay);
});
}
</script>
<form method="POST" action="vendor/zanes.php" enctype="multipart/form-data">
<div style="display: flex; justify-content: center; flex-direction: column; align-items: center;">
<div class="parent">
<td>
<img id="preview" onclick="openModal(this);">
</br>
<input type="file" name="file" onchange="previewImage(this)">
</td>
</div>
<br>
<div class="label">
<label>Название:</label>
<td>
<input type="text" name="title" id="title">
<div id="title_list" style="text-align: center;"></div>
</td>
</div>
<br>
<div class="label">
<label>Тип издания:</label>
<select name="publicationtype">
<option value=""></option>
<option value="Однотомное издание">Однотомное издание</option>
<option value="Многотомное издание">Многотомное издание</option>
<option value="Собрание сочинений">Собрание сочинений</option>
<option value="Периодическое издание">Периодическое издание</option>
</select>
</div>
<br>
<div class="label">
<label>Авторы и составители:</label>
<td>
<input type="text" name="author">
</td>
</div>
<br>
<div class="label">
<label>Под редакцией:</label>
<td>
<input type="text" name="compedit">
</td>
</div>
<br>
<div class="label">
<label>Место:</label>
<td>
<input type="text" name="place">
</td>
</div>
<br>
<div class="label">
<label>Год:</label>
<td>
<input type="text" name="year">
</td>
</div>
<br>
<div class="label">
<label>Издательство:</label>
<td>
<input type="text" name="publisher">
</td>
</div>
<br>
<div class="label">
<label>Количество страниц:</label>
<td>
<input type="text" name="countpages">
</td>
</div>
<br>
<div class="label">
<label>Архив:</label>
<td>
<input type="text" name="archive">
</td>
</div>
<br>
<div class="label">
<label>ББК:</label>
<td>
<input type="text" name="BBK">
</td>
</div>
<br>
<div class="label">
<label>Инвентарный №:</label>
<td>
<input type="text" name="inventnumber">
</td>
</div>
<br>
<div class="label">
<label>Количество экземпляров:</label>
<td>
<input type="text" name="numbinstances">
</td>
</div>
<br>
<div class="label">
<label>Кому выдано:</label>
<td>
<input type="text" name="lasttaker">
</td>
</div>
</div>
<div style="display:flex; flex-direction: row; justify-content: center; align-items: center; margin-bottom: 50px; margin-top: 20px;">
<div class="btn-group">
<input type="submit" name="Save" value="Сохранить">
</div>
</form>
search.php
<?php
require_once 'connect.php';
if ($_SERVER['REQUEST_METHOD'] == "POST" && isset($_POST['title'])) {
$title = mysqli_real_escape_string($connect, $_POST['title']);
$query = "SELECT * FROM infprintedit WHERE title = '$title'";
$result = mysqli_query($connect, $query);
if (mysqli_num_rows($result) > 0) {
$row = mysqli_fetch_assoc($result);
$info = array(
'publicationType' => $row['publicationType'],
'author' => $row['author']
);
echo json_encode($info);
} else {
echo 'Error';
}
}
mysqli_close($connect);
?>