Commit 13312e98 authored by tleb's avatar tleb
Browse files

Highlight a markdown input in red if required and submit is pressed

Kind of copy the behaviour of a Firefox input
Once the submit button has been pressed, highlight in red the text
input if it's required but empty
parent ced90c23
Pipeline #2093 passed with stage
in 35 minutes and 12 seconds
......@@ -166,5 +166,36 @@
},
]
});
$(function() {
let textarea = document.getElementById('{{ widget.attrs.id }}')
let submit = textarea
.closest('form')
.querySelector('input[type="submit"]')
let parentDiv = textarea.parentElement
let submitPressed = false
function checkMarkdownInput() {
// an attribute is null if it does not exist, else a string
let required = textarea.getAttribute('required') != null
let length = textarea.value.trim().length
if (required && length == 0) {
parentDiv.style.boxShadow = 'red 0px 0px 1.5px 1px'
} else {
parentDiv.style.boxShadow = ''
}
}
submit.addEventListener('click', () => {
submitPressed = true
checkMarkdownInput()
})
easymde.codemirror.on('change', () => {
if (submitPressed) {
checkMarkdownInput()
}
})
})
</script>
</div>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment