Я пытаюсь использовать jquery для выбора в таблице в скрипте Google Apps. Я пытаюсь быть в состоянии выбрать несколько строк таблицы одновременно. У меня было это работает, но теперь это не так. Любая помощь будет оценена!
Я заметил изменение, когда добавил элемент <tbody>. Я пытался изменить как <style>, так и саму функцию несколькими способами, но я не могу заставить ее работать как задумано. Я просмотрел документацию и некоторые другие вопросы, такие как THIS и THIS , но я не могу заставить его работать
Ниже приведен весь мой файл Index.html. Я не включил файл Code.GS.
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
#feedback { font-size: 1.4em; }
#table .ui-selecting { background: #FECA40; }
#table .ui-selected { background: #928bff; color: white; }
#table { list-style-type: none; margin: 0; padding: 0; width: 60%; }
#table tr { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
</style>
<script>
$(function() {
google.script.run.withSuccessHandler(buildOptionsList)
.getTeamArray();
});
</script>
<script>
function buildOptionsList(array2) {
var table = document.getElementById('table');
var tableBody = document.createElement('tbody');
var tbodyID = tableBody.setAttribute('id','tbody');
array2.forEach(function(rowData) {
var row = document.createElement('tr');
rowData.forEach(function(cellData) {
var cell = document.createElement('td');
cell.appendChild(document.createTextNode(cellData));
row.appendChild(cell);
});
tableBody.appendChild(row);
});
table.appendChild(tableBody);
document.body.appendChild(table);
}
buildOptionsList(array2);
</script>
<script>
$(document).ready(function(){
$("#searchInput").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#tbody tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
});
</script>
<script>
//need to edit something to get this working again.
$(function() {
$("#table").bind("mousedown", function(e) {
e.metaKey = true;
}).selectable({filter: 'tr'});
});
</script>
</head>
<body>
<div>TEST</div>
<input id="searchInput" value="Type To Search">
<table id="table">
<tr>
<th>GROUP</th>
<th>CLUB</th>
<th>TEAM</th>
<th>STATE</th>
</tr>
</table>
</body>
</html>