Dialog validation works ven when canceling
-
unbewusstsein last edited by
The automatic validation of dialog's form works even when canceling validation.
Then this forbid closing the dialog, the only way being entering correct inputs (which validates) and clicking Cancel).
Obviously input datas validation should not operate when canceling .
This bug is on Opera, Opera Next and Opera DEv.
The test case :
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>dialog test-case</title>
<script>
window.addEventListener('load', start, false);
var dialog_elt;
function start(e) {
console.log("start(e)");
dialog_elt = document.getElementById('dialog');
}
function showModalDialog() {
console.log("showModalDialog()");
dialog_elt.showModal();
dialog_elt.addEventListener('close', dialogPersonsAddConfirm, false);
}
function dialogPersonsAddConfirm(e) {
if (e.target.returnValue == 'yes') {
console.log("dialogPersonsAddConfirm(e) -> returnValue = '" + e.target.returnValue + "'");
} else {
console.log("dialogPersonsAddConfirm(e) -> returnValue = '" + e.target.returnValue + "'");
}
}
</script>
</head>
<body>
<button onclick='showModalDialog();'>Show modial dialog</button>
<dialog id="dialog">
<form method="dialog">
<ul>
<li>
<label for="firstname">Firstname : </label>
<input type='text' id='firstname' name='firstname' placeholder="Enter first name" required />
</li>
<li>
<label for="lastname">Lastname : </label>
<input type='text' id='lastname' name='lastname' placeholder="Enter last name" required />
</li>
<li>
<label for="email">Email :</label>
<input type='email' id='email' name='email' placeholder="Enter email"/>
</li>
</ul>
<p><button type="submit" value="no" autofocus>Cancel</button><button type="submit" value="yes">OK</button>
</form>
</dialog>
</body>
</html>