iger
/
engelsystem
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

move js code for spinner into js file 

now the code is needed only once for all spinners
This commit is contained in:
Thomas Rupprecht 2022-12-10 21:24:21 +01:00 committed by Michael Weimann
parent f12f8a1b3b
commit 2d454ca8ae
2 changed files with 21 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
includes/sys_form.php
View File

@ -30,21 +30,13 @@ function form_spinner(string $name, string $label, int $value)
return form_element($label, ' return form_element($label, '
<div class="input-group"> <div class="input-group">
<input id="' . $id . '" class="form-control" type="number" min="0" step="1" name="' . $name . '" value="' . $value . '" /> <input id="' . $id . '" class="form-control" type="number" min="0" step="1" name="' . $name . '" value="' . $value . '" />
<button id="' . $id . '-down" class="btn btn-secondary" type="button"> <button class="btn btn-secondary spinner-down" type="button" data-input-id="' . $id . '">
' . icon('dash-lg') . ' ' . icon('dash-lg') . '
</button> </button>
<button id="' . $id . '-up" class="btn btn-secondary" type="button"> <button class="btn btn-secondary spinner-up" type="button" data-input-id="' . $id . '">
' . icon('plus-lg') . ' ' . icon('plus-lg') . '
</button> </button>
</div> </div>
<script type="text/javascript">
document.getElementById("' . $id . '-down")?.addEventListener("click", () => {
document.getElementById("' . $id . '").stepDown();
});
document.getElementById("' . $id . '-up")?.addEventListener("click", () => {
document.getElementById("' . $id . '").stepUp();
});
</script>
', $id); ', $id);
} }

19
resources/assets/js/forms.js
View File

@ -111,6 +111,25 @@ ready(() => {
}); });
}); });
ready(() => {
document.querySelectorAll('.spinner-down').forEach((element) => {
const inputElement = document.getElementById(element.dataset.inputId);
if (inputElement) {
element.addEventListener('click', () => {
inputElement.stepDown();
});
}
});
document.querySelectorAll('.spinner-up').forEach((element) => {
const inputElement = document.getElementById(element.dataset.inputId);
if (inputElement) {
element.addEventListener('click', () => {
inputElement.stepUp();
});
}
});
});
/** /**
* Button to set current time in time input fields. * Button to set current time in time input fields.
*/ */