diff --git a/Modules/TestQuestionPool/templates/default/tpl.il_as_qpl_cloze_question_gap_numeric.html b/Modules/TestQuestionPool/templates/default/tpl.il_as_qpl_cloze_question_gap_numeric.html index c1fb5a97168e..bb71cd14a1f8 100755 --- a/Modules/TestQuestionPool/templates/default/tpl.il_as_qpl_cloze_question_gap_numeric.html +++ b/Modules/TestQuestionPool/templates/default/tpl.il_as_qpl_cloze_question_gap_numeric.html @@ -1 +1 @@ - size="{TEXT_GAP_SIZE}" maxlength="{TEXT_GAP_SIZE}" /> \ No newline at end of file + size="{TEXT_GAP_SIZE}" maxlength="{TEXT_GAP_SIZE}" /> diff --git a/Services/JavaScript/js/Basic.js b/Services/JavaScript/js/Basic.js index 281dad434535..7c21d2f8d153 100644 --- a/Services/JavaScript/js/Basic.js +++ b/Services/JavaScript/js/Basic.js @@ -1051,3 +1051,68 @@ function startSAHS(SAHSurl, SAHStarget, SAHSopenMode, SAHSwidth, SAHSheight) } } +/** + * Related to https://mantis.ilias.de/view.php?id=26494 + * jQuery "inputFilter" Extension. + */ +(function($) { + /** + * @param {mixed} inputFilter + * @returns {jQuery} + */ + $.fn.inputFilter = function(inputFilter) { + return this.on("input keydown keyup mousedown mouseup select contextmenu drop", function(e) { + if (inputFilter(this.value)) { + this.oldValue = this.value; + this.oldSelectionStart = this.selectionStart; + this.oldSelectionEnd = this.selectionEnd; + } else if (this.hasOwnProperty("oldValue")) { + this.value = this.oldValue; + this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd); + } else { + this.value = ""; + } + }); + }; +}(jQuery)); + +/** + * Related to https://mantis.ilias.de/view.php?id=26494 + * UI-Feedback : check if a numeric field isset but value is not numeric. + */ +function numericInputCheck() { + + const numericInput = $( '.ilcqinput_NumericInput' ); + + // Only if present. + if ( numericInput.length ) { + + // Append ilcqinput_NumericInputInvalid class for visually distinguishable numeric input fields. + // -> Onload. + let value = $( numericInput ).val().toString().replace( ',', '.' ); + if ( value && !$.isNumeric( value ) ) { + $( numericInput ).addClass( 'ilcqinput_NumericInputInvalid' ); + } else { + $( numericInput ).removeClass( 'ilcqinput_NumericInputInvalid' ); + } + // -> OnChange. + $( numericInput ).on( 'change', function() { + let value = $( this ).val().toString().replace( ',', '.' ); + if ( value && !$.isNumeric( value ) ) { + $( this ).addClass( 'ilcqinput_NumericInputInvalid' ); + } else { + $( this ).removeClass( 'ilcqinput_NumericInputInvalid' ); + } + } ); + + // Only allow numeric values foreach ".ilcqinput_NumericInput" classified input field. + $( numericInput ).inputFilter( function( value ) { + value = value.toString().replace( ',', '.' ); + return !$.trim( value ) || $.isNumeric( value ); + } ); + } +} + +$(document).ready( function( ) { + numericInputCheck(); +}); diff --git a/templates/default/default.css b/templates/default/default.css index 707a6182cfdb..99e3c7ebd96f 100755 --- a/templates/default/default.css +++ b/templates/default/default.css @@ -317,3 +317,19 @@ div.il_editarea { img.spacer { display: block; } + +/* ------------------ visually distinguishable numeric input fields -------------- + Styles related to https://mantis.ilias.de/view.php?id=26494 + */ +.ilcqinput_NumericInput { + background: #E0FAFA; +} + +.ilcqinput_NumericInput+span:after { + content: " (!) "; + color: green; +} + +.ilcqinput_NumericInputInvalid { + background: red; +} \ No newline at end of file