Hacky js

app/views/form/_radio_question.html.erb

@@ -7,7 +7,29 @@
       <% if key.starts_with?("divider") %>
         <%= f.govuk_radio_divider %>
       <% else %>
-        <%= f.govuk_radio_button question_key, key, label: { text: val } %>
+        <%= f.govuk_radio_button question_key, key, label: { text: val }, onchange: "displayConditional()" %>
       <% end %>
     <% end %>
 <% end %>
+
+<script>
+  function displayConditional() {
+    const show_if = <%= raw question["show_if"].to_json %>;
+    if(show_if !== null){
+      const conditionalQuestionKey = <%= raw question_key.to_json %>;
+      const conditionalQuestion = document.getElementById(conditionalQuestionKey + "_div")
+      conditionalQuestion.style.display = "none";
+      Object.entries(show_if).forEach(([key, values]) => {
+        values.forEach((value) => {
+          let answerOption = document.getElementById(key.replace("_", "-") + "-" + value + "-field")
+          if(answerOption !== null) {
+            if(answerOption.checked){
+              conditionalQuestion.style.display = "block"
+            }
+          }
+        })
+      });
+    }
+  }
+  displayConditional()
+</script>

app/views/form/page.html.erb

@@ -14,7 +14,9 @@
   <%= form_with action: '/case_logs', method: "next_page", builder: GOVUKDesignSystemFormBuilder::FormBuilder do |f| %>
 
     <% page_info["questions"].map do |question_key, question| %>
-      <%= render partial: "form/#{question["type"]}_question", locals: { question_key: question_key, question: question, f: f } %>
+      <div id=<%= "#{question_key}_div" %> >
+        <%= render partial: "form/#{question["type"]}_question", locals: { question_key: question_key, question: question, f: f } %>
+      </div>
     <% end %>
 
     <%= f.hidden_field :previous_page, value: page_key %>

config/forms/2021_2022.json

@@ -296,6 +296,9 @@
                     "1": "No - they left up to 5 years ago",
                     "2": "No - they left more than 5 years ago",
                     "3": "Prefer not to say"
+                  },
+                  "show_if": {
+                    "armed_forces": ["0", "1"]
                   }
                 },
                 "armed_forces_injured": {
@@ -306,6 +309,9 @@
                     "0": "Yes",
                     "1": "No",
                     "2": "Prefer not to say"
+                  },
+                  "show_if": {
+                    "armed_forces": ["0", "1"]
                   }
                 },
                 "armed_forces_partner": {