sam.hadow/aliexpress-price-tracker
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

input fields validity check

Browse Source
This commit is contained in:
Sam Hadow 2024-02-17 00:18:24 +01:00
parent a2eea73a04
commit f1b698fb46
2 changed files with 31 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/app.html
View File

@ -22,7 +22,7 @@
<p></p> <p></p>
<div class="btn-toolbar btn-group-sm" role="toolbar" aria-label="Toolbar"> <div class="btn-toolbar btn-group-sm" role="toolbar" aria-label="Toolbar">
<div class="btn-group mr-2 w-50" role="group" aria-label="Add group"> <div class="btn-group mr-2 w-50" role="group" aria-label="Add group">
<input id="additemid" type="text" class="form-control input-sm w-15 w-50" placeholder="item id" pattern="[0-9]*"> <input id="additemid" type="text" class="form-control input-sm w-15 w-50" placeholder="item id" pattern="[0-9]+" required>
<input id="addattributes" type="text" class="form-control input-sm w-15" placeholder="attributes (comma separated)" pattern="[0-9a-zA-Z, ]*"> <input id="addattributes" type="text" class="form-control input-sm w-15" placeholder="attributes (comma separated)" pattern="[0-9a-zA-Z, ]*">
<button id="addbutton" class="btn btn-secondary" type="button">add</button> <button id="addbutton" class="btn btn-secondary" type="button">add</button>
</div> </div>

54
web/app.js
View File

@ -53,35 +53,41 @@ render_graphs_wrapper();
document.getElementById("addbutton").addEventListener("click", addItem); document.getElementById("addbutton").addEventListener("click", addItem);
async function addItem() { async function addItem() {
const apiUrl = `${currentUrl}app/add`; const inputFieldId = document.getElementById("additemid");
const postData = { const inputFieldAttributes = document.getElementById("addattributes");
itemid: document.getElementById("additemid").value, if (inputFieldId.checkValidity() && inputFieldAttributes.checkValidity()) {
attributes: document.getElementById("addattributes").value const apiUrl = `${currentUrl}app/add`;
}; const postData = {
itemid: inputFieldId.value,
attributes: inputFieldAttributes.value
};
// clear input fields // clear input fields
document.getElementById("additemid").value=''; inputFieldId.value='';
document.getElementById("addattributes").value=''; inputFieldAttributes.value='';
const requestOptions = { const requestOptions = {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },
body: JSON.stringify(postData) body: JSON.stringify(postData)
}; };
const response = await fetch(apiUrl, requestOptions) const response = await fetch(apiUrl, requestOptions)
.catch(error => { .catch(error => {
console.error('Error during POST request:', error); console.error('Error during POST request:', error);
}); });
if (response.ok) { if (response.ok) {
console.log(response); console.log(response);
// refresh graphs to display new item // refresh graphs to display new item
refresh_graphs(); refresh_graphs();
} else {
throw new Error('Error in server response');
}
} else { } else {
throw new Error('Error in server response'); console.log('invalid content in input fields')
} }
} }