diff --git a/html/webpage/assets/js/script.js b/html/webpage/assets/js/script.js
index f61f4c7..a1497fd 100644
--- a/html/webpage/assets/js/script.js
+++ b/html/webpage/assets/js/script.js
@@ -395,13 +395,18 @@ $(document).ready(function () {
// initialize first state of buttons and text input
$('#soundbanktablebody').empty();
selectedsoundrow = null;
- let $btnRemove = $('#btnRemove');
- let $btnEdit = $('#btnEdit');
- let $modal = $('#soundbankmodal');
+ const $btnRemove = $('#btnRemove');
+ const $btnEdit = $('#btnEdit');
+ const $modal = $('#soundbankmodal');
+ const modalEl = $modal[0];
+ const modal = bootstrap.Modal.getOrCreateInstance(modalEl); // creates or reuses
$btnRemove.prop('disabled', true);
$btnEdit.prop('disabled', true);
+
+
+
sendCommand("getSoundBankList", "");
$('#btnClear').click(() => {
if (confirm(`Are you sure want to clear Soundbank ? This procedure is not reversible`)) {
@@ -409,7 +414,7 @@ $(document).ready(function () {
}
});
$('#btnAdd').click(() => {
- $modal.modal('show');
+ modal.show();
$modal.off('hidden.bs.modal').on('hidden.bs.modal', function () {
const desc = $('#description').val();
console.log('Description input value:', desc);
@@ -448,7 +453,7 @@ $(document).ready(function () {
path: cells.eq(6).text()
}
if (confirm(`Are you sure to edit soundbank [${sb.index}] Description=${sb.description} Tag=${sb.tag}?`)) {
- $modal.modal('show');
+ modal.show();
$modal.off('hidden.bs.modal').on('hidden.bs.modal', function () {
const desc = $('#description').val();
console.log('Description input value:', desc);