make edit view conditionally display the second nationality dropdown …

…depending on checkbox state

app/controllers/people_controller.rb

@@ -15,6 +15,9 @@ def new
 
   def update
     @person.roles.build if @person.roles.empty?
+    if params['has_nationality2']['{}'].to_i.zero?
+      params['person']['nationality2'] = nil
+    end
     super
   end
 

app/javascript/controllers/index.js

@@ -4,5 +4,8 @@
 
 import { application } from "./application"
 
-import Remote_modal_controller from "./remote_modal_controller"
-application.register("remote-modal", Remote_modal_controller)
+import NationalityTwoController from "./nationality_two_controller"
+application.register("nationality-two", NationalityTwoController)
+
+import RemoteModalController from "./remote_modal_controller"
+application.register("remote-modal", RemoteModalController)

app/javascript/controllers/nationality_two_controller.js

@@ -0,0 +1,18 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+    setVisibility() {
+        const natTwoElements = document.getElementsByClassName('nationality-two')
+        const natTwoCheckbox = document.getElementById('nat-two-checkbox')
+        for(const element of natTwoElements) {
+            !natTwoCheckbox.checked ? element.classList.add('d-none') : element.classList.remove('d-none')
+        }
+    }
+
+    connect() {
+        this.setVisibility();
+    }
+    nationalityTwoVisible() {
+        this.setVisibility()
+    }
+}

app/views/people/edit.html.haml

@@ -50,14 +50,13 @@
               %td= form.date_field :birthdate, class: "form-control w-100"
             %th.fw-normal Doppelbürger
             %tr
-              %td= check_box :has_nationality2, {}, checked: @person.nationality2?
+              %td{"data-controller"=>"nationality-two"}= check_box :has_nationality2, {}, {"checked" => @person.nationality2?, "data-action" => "nationality-two#nationalityTwoVisible", "id" => "nat-two-checkbox"}
             %th.fw-normal Erste Nationalität
             %tr
               %td= form.collection_select :nationality, ISO3166::Country.all.sort, :alpha2, :name, {}, class: "form-select w-100"
-            - if @person.nationality2?
-              %th.fw-normal Zweite Nationalität
-              %tr
-                %td= form.collection_select :nationality2, ISO3166::Country.all.sort, :alpha2, :name, {}, class: "form-select w-100"
+            %th.fw-normal.nationality-two Zweite Nationalität
+            %tr.nationality-two
+              %td= form.collection_select :nationality2, ISO3166::Country.all.sort, :alpha2, :name, {}, class: "form-select w-100"
             %th.fw-normal Zivilstand
             %tr
               %td= form.collection_select :marital_status, Person.marital_statuses, :first, :first, { selected: @person.marital_status }, class: "form-select w-100"