I have set up a little web front end to insert data into a realtime database. And it is working, below is the relevant code.
Now I would like to improve this code to prevent the user from adding an element with the same url. What is the best way to handle this. I have tried a few things but that did not work. And I do not really want to use the url as the key either.
Please let me know for any good suggestion.
<form id='adTF'>
Name: <input id='name' type='text' maxlength=128 size=50 value='' required>
<br/><br/>
URL: <input id='url' type='text' maxlength=128 size=50 value='' required>
<br/><br/>
<input type='submit' value='Submit'>
</form>
<script>
document.getElementById('adTF').addEventListener('submit',addNewItem)
var dbReference = firebase.database().ref('ItemList');
function addNewItem(event) {
event.preventDefault();
const url = document.getElementById('url').value.trim(),
name = document.getElementById('name').value.trim();
let newItem = dbReference.push();
newItem.set({url:url,name:name});
document.getElementById('url').value = '';
document.getElementById('name').value = '';
} /* End of addNewItem */
</script>