diff options
Diffstat (limited to '_tools/ascii-hex.md')
| -rw-r--r-- | _tools/ascii-hex.md | 53 |
1 files changed, 35 insertions, 18 deletions
diff --git a/_tools/ascii-hex.md b/_tools/ascii-hex.md index 42d4311..ef0d8ef 100644 --- a/_tools/ascii-hex.md +++ b/_tools/ascii-hex.md @@ -7,10 +7,13 @@ layout: default --- <h1>ASCII To Hex</h1> -<form id="ascii-to-hex"> +<form id="ascii-to-hex" novalidate> <div class="form-floating mb-3"> - <input type="text" class="form-control" placeholder="ASCII" name="ascii-to-hex" id="ascii-to-hex" > + <input type="text" class="form-control" placeholder="ASCII" name="ascii-to-hex" id="ascii-to-hex" required> <label for="ascii-to-hex">ASCII</label> + <div class="invalid-feedback"> + Please provide a valid input text. + </div> </div> <div class="form-floating mb-3"> <input type="text" class="form-control" placeholder="Glue" name="ascii-to-hex-glue" id="ascii-to-hex-glue" value=" "> @@ -25,10 +28,13 @@ layout: default </div> </form> <h1>Hex To ASCII</h1> -<form id="hex-to-ascii"> +<form id="hex-to-ascii" novalidate> <div class="form-floating mb-3"> - <input type="text" class="form-control" placeholder="HEX" name="hex-to-ascii" id="hex-to-ascii"> + <input type="text" class="form-control" placeholder="HEX" name="hex-to-ascii" id="hex-to-ascii" required> <label for="hex-to-ascii">HEX</label> + <div class="invalid-feedback"> + Please provide a valid input text. + </div> </div> <div class="form-floating mb-3"> <input type="text" class="form-control" placeholder="Separator" name="hex-to-ascii-separator" id="hex-to-ascii-separator" value=" "> @@ -53,24 +59,35 @@ layout: default var asciiToHexForm = document.getElementById('ascii-to-hex'); asciiToHexForm.addEventListener('submit',(event) => { - event.preventDefault(); - var fomrdata = new FormData(asciiToHexForm); - var str = fomrdata.get('ascii-to-hex'); - var glue = fomrdata.get('ascii-to-hex-glue'); - var prefixi = glue !== "" ? "0x" : ""; - var prefix = glue === "" ? "0x" : ""; - var hex = prefix + ([...str].map((elem, n) => prefixi+Number(str.charCodeAt(n)).toString(16)).join(glue)); - document.getElementById('hex-result').value = hex; + if (!asciiToHexForm.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); + var fomrdata = new FormData(asciiToHexForm); + var str = fomrdata.get('ascii-to-hex'); + var glue = fomrdata.get('ascii-to-hex-glue'); + var prefixi = glue !== "" ? "0x" : ""; + var prefix = glue === "" ? "0x" : ""; + var hex = prefix + ([...str].map((elem, n) => prefixi+Number(str.charCodeAt(n)).toString(16)).join(glue)); + document.getElementById('hex-result').value = hex; + } + [...asciiToHexForm.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); }); var hexToAsciiForm = document.getElementById('hex-to-ascii'); hexToAsciiForm.addEventListener('submit',(event) => { - event.preventDefault(); - var fomrdata = new FormData(hexToAsciiForm); - var str = fomrdata.get('hex-to-ascii'); - var separator = fomrdata.get('hex-to-ascii-separator'); - var ascii = separator === "" ? getChunks(str.substring(2),2).map(el => String.fromCharCode(parseInt(el, 16))).join('') : str.split(separator).map(el => String.fromCharCode(Number(el))).join(''); - document.getElementById('ascii-result').value = ascii; + if (!hexToAsciiForm.checkValidity()) { + event.preventDefault(); + } else { + event.preventDefault(); + var fomrdata = new FormData(hexToAsciiForm); + var str = fomrdata.get('hex-to-ascii'); + var separator = fomrdata.get('hex-to-ascii-separator'); + var ascii = separator === "" ? getChunks(str.substring(2),2).map(el => String.fromCharCode(parseInt(el, 16))).join('') : str.split(separator).map(el => String.fromCharCode(Number(el))).join(''); + document.getElementById('ascii-result').value = ascii; + } + [...hexToAsciiForm.elements].map(e => e.parentNode).forEach(e => e.classList.toggle('was-validated', true)); + }); </script> |