isikukood
Version:
Estonian personal ID (isikukood) JavaScript module
77 lines (72 loc) • 2.88 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Isikukoodi genraator ja validaator</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main>
<h1>Estonian Personal ID</h1>
<form id="form-personal-id">
<p>Validate or generate personal Estonian ID</p>
<div class="input">
<input type="text" name="personal-id" id="personal-id" placeholder="11-digit personal number"
aria-label="11-digit personal number" maxlength="11" required>
<button type="submit" class="minimal">Validate</button>
<button id="generate" class="minimal">Generate</button>
</div>
<output id="result" class="result invalid"></output>
<dl id="result-parsed" hidden>
<dt>Gender</dt>
<dd id="result-gender"></dd>
<dt>Birthday</dt>
<dd id="result-bd"></dd>
<dt>Age</dt>
<dd id="result-age"></dd>
</dl>
</form>
</main>
<script type="module">
import Isikukood from './isikukood.esm.js';
document.addEventListener('DOMContentLoaded', () => {
const form = document.getElementById('form-personal-id');
const personalIdInput = document.getElementById('personal-id');
const resultElem = document.getElementById('result');
const resultParsedElem = document.getElementById('result-parsed');
const resultGender = document.getElementById('result-gender');
const resultBD = document.getElementById('result-bd');
const resultAge = document.getElementById('result-age');
const generateBtn = document.getElementById('generate');
form.addEventListener('submit', (event) => {
event.preventDefault();
const isikukood = new Isikukood(personalIdInput.value);
if (isikukood.validate()) {
form.classList.remove('-invalid');
resultElem.textContent = 'Personal ID is valid';
resultParsedElem.hidden = false;
const data = isikukood.parse();
resultGender.textContent = data.gender;
resultBD.textContent = data.birthDay.toLocaleDateString('et-EE', {
month: 'long',
day: 'numeric',
year: 'numeric',
});
resultAge.textContent = data.age;
} else {
form.classList.add('-invalid');
resultElem.textContent = 'Personal ID is invalid';
resultParsedElem.hidden = true;
}
});
generateBtn.addEventListener('click', (event) => {
event.preventDefault();
personalIdInput.value = Isikukood.generate();
resultElem.textContent = '';
resultParsedElem.hidden = true;
form.classList.remove('-invalid');
});
});
</script>
</body>
</html>