[Zurich] Don't delete extra fields when editing contact

Editing a contact with extra fields would cause those fields to be
deleted because they weren't included in the POST request when saving.
This change ensures they're present in the DOM, but hidden by default.

2 files changed, 17 insertions, 0 deletions

diff --git a/templates/web/zurich/admin/contact-form.html b/templates/web/zurich/admin/contact-form.html
index 8d8d184e6..3840d46a4 100644
--- a/templates/web/zurich/admin/contact-form.html
+++ b/templates/web/zurich/admin/contact-form.html
@@ -19,6 +19,16 @@
     <input type="text" class="form-control" name="email" value="[% contact.email | html %]" size="30">
 
     <p>
+      <strong>[% loc('Extra fields:') %]</strong>
+      [% IF contact.in_storage %]
+        <a href="#" class="js-show-extra-fields hidden-nojs">([% loc('show') %])</a>
+      [% END %]
+    </p>
+    <div class="js-extra-fields-ui[% IF contact.in_storage %] hidden-js[% END %]">
+      [% INCLUDE 'admin/extra-metadata-form.html' metas=(contact.get_metadata_for_input OR []) %]
+    </div>
+
+    <p>
       [% IF contact.in_storage %]
         <label for="state">[% loc('State') %]</label>
         <select name="state" id="state">
diff --git a/web/cobrands/fixmystreet/admin.js b/web/cobrands/fixmystreet/admin.js
index d1a75a6dc..5c0378ad2 100644
--- a/web/cobrands/fixmystreet/admin.js
+++ b/web/cobrands/fixmystreet/admin.js
@@ -99,6 +99,13 @@ $(function(){
 
     // Bits for the report extra fields form builder:
 
+    // Reveal the UI when 'show' link is clicked
+    $(".js-show-extra-fields").click(function(e) {
+        e.preventDefault();
+        $(this).hide();
+        $(".js-extra-fields-ui").removeClass("hidden-js");
+    });
+
     // If type is changed to 'singlevaluelist' show the options list
     $(".js-metadata-items").on("change", ".js-metadata-item-type", function() {
         var $this = $(this);