From f72eb4266a6f670b1a56f9eafc4c83246c2f0524 Mon Sep 17 00:00:00 2001 From: Oliver Date: Sat, 14 Aug 2021 12:31:22 +1000 Subject: [PATCH 1/4] remove old debug message --- InvenTree/templates/js/translated/forms.js | 1 - 1 file changed, 1 deletion(-) diff --git a/InvenTree/templates/js/translated/forms.js b/InvenTree/templates/js/translated/forms.js index 7576f27670..a11891ff51 100644 --- a/InvenTree/templates/js/translated/forms.js +++ b/InvenTree/templates/js/translated/forms.js @@ -369,7 +369,6 @@ function constructFormBody(fields, options) { // Initialize an "empty" field for each specified field for (field in displayed_fields) { if (!(field in fields)) { - console.log("adding blank field for ", field); fields[field] = {}; } } From f753e11f10f8e310834963eb7976386e4db69b61 Mon Sep 17 00:00:00 2001 From: Oliver Date: Sat, 14 Aug 2021 13:41:19 +1000 Subject: [PATCH 2/4] Improve error notification for modal forms - Scroll to error - Add red border and background to the form --- InvenTree/InvenTree/static/css/inventree.css | 5 ++++ InvenTree/templates/js/translated/forms.js | 29 ++++++++++++++++++++ 2 files changed, 34 insertions(+) diff --git a/InvenTree/InvenTree/static/css/inventree.css b/InvenTree/InvenTree/static/css/inventree.css index 74b3b63169..d9f3b4beac 100644 --- a/InvenTree/InvenTree/static/css/inventree.css +++ b/InvenTree/InvenTree/static/css/inventree.css @@ -640,6 +640,11 @@ z-index: 9999; } +.modal-error { + border: 2px #F99 solid; + background-color: #faf0f0; +} + .modal-header { border-bottom: 1px solid #ddd; } diff --git a/InvenTree/templates/js/translated/forms.js b/InvenTree/templates/js/translated/forms.js index a11891ff51..d03819a00f 100644 --- a/InvenTree/templates/js/translated/forms.js +++ b/InvenTree/templates/js/translated/forms.js @@ -516,6 +516,9 @@ function constructFormBody(fields, options) { }); initializeGroups(fields, options); + + // Scroll to the top + $(options.modal).find('.modal-form-content-wrapper').scrollTop(0); } @@ -867,6 +870,8 @@ function handleFormErrors(errors, fields, options) { } } + var first_error_field = null; + for (field_name in errors) { // Add the 'has-error' class @@ -876,6 +881,10 @@ function handleFormErrors(errors, fields, options) { var field_errors = errors[field_name]; + if (field_errors && !first_error_field && isFieldVisible(field_name, options)) { + first_error_field = field_name; + } + // Add an entry for each returned error message for (var idx = field_errors.length-1; idx >= 0; idx--) { @@ -889,6 +898,26 @@ function handleFormErrors(errors, fields, options) { field_dom.append(html); } } + + var offset = 0; + + if (first_error_field) { + // Ensure that the field in question is visible + document.querySelector(`#div_id_${field_name}`).scrollIntoView({ + behavior: 'smooth', + }); + } else { + // Scroll to the top of the form + $(options.modal).find('.modal-form-content-wrapper').scrollTop(offset); + } + + $(options.modal).find('.modal-content').addClass('modal-error'); +} + + +function isFieldVisible(field, options) { + + return $(options.modal).find(`#div_id_${field}`).is(':visible'); } From 32fafc76d7315fb20b57e9d32de89e993af05dbb Mon Sep 17 00:00:00 2001 From: Oliver Date: Sat, 14 Aug 2021 13:42:50 +1000 Subject: [PATCH 3/4] css tweaks --- InvenTree/InvenTree/static/css/inventree.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/InvenTree/InvenTree/static/css/inventree.css b/InvenTree/InvenTree/static/css/inventree.css index d9f3b4beac..9ed478ea90 100644 --- a/InvenTree/InvenTree/static/css/inventree.css +++ b/InvenTree/InvenTree/static/css/inventree.css @@ -641,8 +641,8 @@ } .modal-error { - border: 2px #F99 solid; - background-color: #faf0f0; + border: 2px #FCC solid; + background-color: #f5f0f0; } .modal-header { From 28bccea57be3039e0613a1b27545fb44a302796e Mon Sep 17 00:00:00 2001 From: Oliver Date: Sat, 14 Aug 2021 13:43:38 +1000 Subject: [PATCH 4/4] Cleanup --- InvenTree/templates/js/translated/forms.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/InvenTree/templates/js/translated/forms.js b/InvenTree/templates/js/translated/forms.js index d03819a00f..904053a423 100644 --- a/InvenTree/templates/js/translated/forms.js +++ b/InvenTree/templates/js/translated/forms.js @@ -899,8 +899,6 @@ function handleFormErrors(errors, fields, options) { } } - var offset = 0; - if (first_error_field) { // Ensure that the field in question is visible document.querySelector(`#div_id_${field_name}`).scrollIntoView({ @@ -908,7 +906,7 @@ function handleFormErrors(errors, fields, options) { }); } else { // Scroll to the top of the form - $(options.modal).find('.modal-form-content-wrapper').scrollTop(offset); + $(options.modal).find('.modal-form-content-wrapper').scrollTop(0); } $(options.modal).find('.modal-content').addClass('modal-error');