Im currently trying to find out if its possible to change a text in extension when a submit has happend. I currently have a text saying “ENTER DISCORD USER ID AND SUBMIT” and when an user has entered its USER ID and submitted, the text should be changed to “USER ID SUBMITTED” and the text should always say that afterwards, meaning that if someone closes and opens the extensions – the text should still say “USER ID SUBMITTED”.
<!DOCTYPE html>
<head>
<link rel="stylesheet" href="../css/style.css">
<script src="../js/popup.js"></script>
</head>
<body>
<div class="text-center">
<form id="form" class="form-control mt10">
<label> <input type="number" id="discord-id-input" name="discord-id-input"></label>
<button id="discord-id-button" type="submit" class="submit"></button>
<output id="help-text" class="help-text" value="">ENTER DISCORD USER ID AND SUBMIT</output>
</form>
</div>
</body>
function get_discord_id(callback) {
chrome.storage.sync.get(["discord_id"], (result) => {
callback(result.discord_id);
});
}
function set_discord_id(discord_id) {
chrome.storage.sync.set({ discord_id: discord_id }, () => {});
}
window.addEventListener("DOMContentLoaded", (e) => {
// check if discord ID is already stored
get_discord_id((discord_id) => {
if (discord_id == null) {
form.addEventListener('submit', () => {
let value = document.getElementById("discord-id-input").value;
chrome.runtime.sendMessage({ discord_id: value }, function(response) {});
set_discord_id(value);
document.getElementById('help-text').innerHTML = 'USER ID SUBMITTED';
});
e.preventDefault();
};
});
});
I wonder how I am able to permanent change a text after a submitted trigger has happend?