diff --git a/app/webpacker/controllers/bulk_form_controller.js b/app/webpacker/controllers/bulk_form_controller.js index 98a6063a0e..1f2aa80f0e 100644 --- a/app/webpacker/controllers/bulk_form_controller.js +++ b/app/webpacker/controllers/bulk_form_controller.js @@ -1,6 +1,19 @@ import { Controller } from "stimulus"; -// Manages "changed" state for a form with multiple records +// Manage "changed" state for a form with multiple records +// +// When any elements are changed: +// - the element is marked ".changed" +// - "actions" element appears +// - "changedSummary" element is updated using I18n +// - "disableSelector" elements are disabled +// - The browser will warn if trying to leave the page +// +// Supported element types: +// - input[type=text] and similar +// - input[type=checkbox] +// - select (single) - including tom-select +// export default class BulkFormController extends Controller { static targets = ["actions", "changedSummary"]; static values = { @@ -113,6 +126,11 @@ export default class BulkFormController extends Controller { #isChanged(element) { if (element.type == "checkbox") { return element.defaultChecked !== undefined && element.checked != element.defaultChecked; + + } else if (element.type == "select-one") { + const defaultSelected = Array.from(element.options).find((opt)=>opt.hasAttribute('selected')); + return element.selectedOptions[0] != defaultSelected; + } else { return element.defaultValue !== undefined && element.value != element.defaultValue; } diff --git a/app/webpacker/css/admin_v3/components/tom_select.scss b/app/webpacker/css/admin_v3/components/tom_select.scss index f63b63898d..c616e8d5f4 100644 --- a/app/webpacker/css/admin_v3/components/tom_select.scss +++ b/app/webpacker/css/admin_v3/components/tom_select.scss @@ -188,3 +188,12 @@ } } } + +// Display as "changed" if sibling select is marked as changed. +select.changed + .ts-wrapper { + &.single, &.multi { + .ts-control { + border-color: $color-txt-changed-brd; + } + } +} diff --git a/spec/javascripts/stimulus/bulk_form_controller_test.js b/spec/javascripts/stimulus/bulk_form_controller_test.js index 7571191708..82d83c7271 100644 --- a/spec/javascripts/stimulus/bulk_form_controller_test.js +++ b/spec/javascripts/stimulus/bulk_form_controller_test.js @@ -36,6 +36,10 @@ describe("BulkFormController", () => {