jqxValidator error propagation
Demonstrates that jqxValidator does not propagate errors as expected.
by JC Wren
HTML
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<form id="testForm" action="./">
<table class="register-table">
<tr>
<td>E-mail:</td>
<td>
<input type="text" id="emailInput" class="text-input" />
</td>
</tr>
</table>
</form>
<input type="button" style="margin:30px;" id="buttonnotc" value="No try/catch" />
<input type="button" style="margin:30px;" id="buttontc" value="With try/catch" />
JavaScript
//
// Demonstrate that jqxValidator does not propogate errors
//
'use strict';
$('#testForm').jqxValidator({
focus: true,
closeOnClick: false,
rules: [{
input: '#emailInput',
message: 'Invalid e-mail!',
action: 'blur',
rule: function (input) {
num = 1; // This variable is not declared and causes an error with 'use strict'
return true;
}
}],
onError: function () {
alert('onError function triggered');
},
});
$("#buttonnotc,#buttontc").jqxButton({
theme: 'energyblue',
width: 120,
height: 30
});
$("#buttonnotc").click(function () {
$('#testForm').jqxValidator('validate');
});
$("#buttontc").click(function () {
try {
$('#testForm').jqxValidator('validate');
} catch (e) {
alert(e);
}
});
$('#testForm').on('validationError', function (event) {
alert('Validate error!');
});