<!DOCTYPE html> <html lang="la"> <head> <meta charset="UTF-8"> <title>Familia Romana – Pensum A</title> <script type="text/javascript"> function adjust_size() { const forms = document.querySelectorAll('form'); const form = forms[0]; Array.from(form.elements).forEach((input) => { if (input.type=="text") { input.setAttribute("size", input.dataset.expected.length); } }); } function validate() { const forms = document.querySelectorAll('form'); const form = forms[0]; Array.from(form.elements).forEach((input) => { console.log(input); if (input.type=="text" && input.value != input.dataset.expected) { input.setAttribute("style", "border-color:red"); console.log('incorrect!') } }); console.log('dupa'); return false; } </script> </head> <body> <form class="Pensum_A" onsubmit="return validate();"> {{pensum_content|safe}} <br> <input type="submit" value="Submit"> </form> <script type="text/javascript">adjust_size();</script> </body> </html>