add options object to HtmlHelpers »parseResponse«

static/js/services/htmlHelpers.js

@@ -3,27 +3,44 @@
 
   window.HtmlHelpers = (function() {
 
-    function _prefixIds(element) {
-      var idPrefix = Math.floor(Math.random() * 100000);
+    // `parseResponse` takes a raw HttpClient response and an options object.
+    // Returns an object with `element` being an contextual fragment of the
+    // HTML in the response and `ifPrefix` being the prefix that was used to
+    // "unique-ify" the ids of the received HTML.
+    // Original Response IDs can optionally be kept by adding `originalIds: true`
+    // to the `options` object.
+    function parseResponse(response, options) {
+      options = options || {};
+
+      return response.text().then(function (responseText) {
+        var docFrag = document.createRange().createContextualFragment(responseText);
+        var idPrefix;
+        if (!options.originalIds) {
+          idPrefix = _getIdPrefix();
+          _prefixIds(docFrag, idPrefix);
+        }
+        return Promise.resolve({ idPrefix: idPrefix, element: docFrag });
+      },
+      function (error) {
+        return Promise.reject(error);
+      }).catch(function (error) { console.error(error); });
+    }
+
+    function _prefixIds(element, idPrefix) {
       var idAttrs = ['id', 'for', 'data-conditional-input', 'data-modal-trigger'];
 
       idAttrs.forEach(function(attr) {
         Array.from(element.querySelectorAll('[' + attr + ']')).forEach(function(input) {
-          var value = idPrefix + '__' + input.getAttribute(attr);
+          var value = idPrefix + input.getAttribute(attr);
           input.setAttribute(attr, value);
         });
       });
     }
 
-    function parseResponse(response) {
-      return response.text().then(function (responseText) {
-        var docFrag = document.createRange().createContextualFragment(responseText);
-        _prefixIds(docFrag);
-        return Promise.resolve(docFrag);
-      },
-      function (error) {
-        return Promise.reject(error);
-      }).catch(function (error) { console.error(error); });
+    function _getIdPrefix() {
+      // leading 'r'(andom) to overcome the fact that IDs
+      // starting with a numeric value are not valid in CSS
+      return 'r' + Math.floor(Math.random() * 100000) + '__';
     }
 
     return {

static/js/utils/asyncTable.js

@@ -324,14 +324,14 @@
         headers: headers,
         accept: HttpClient.ACCEPT.TEXT_HTML,
       }).then(function(response) {
-        return HtmlHelpers.parseResponse(response);
-      }).then(function(responseElement) {
+        return HtmlHelpers.parseResponse(response, { originalIds: true });
+      }).then(function(response) {
         setLocalStorageParameter('currentTableUrl', url.href);
         // reset table
         removeListeners();
         element.classList.remove(ASYNC_TABLE_INITIALIZED_CLASS);
         // update table with new
-        updateWrapperContents(responseElement);
+        updateWrapperContents(response);
 
         if (callback && typeof callback === 'function') {
           callback(element);
@@ -344,10 +344,10 @@
       });
     }
 
-    function updateWrapperContents(newHtmlElement) {
+    function updateWrapperContents(response) {
       var newPage = document.createElement('div');
-      newPage.appendChild(newHtmlElement);
-      var newWrapperContents = newPage.querySelector('#' + element.id + '__' + element.id);
+      newPage.appendChild(response.element);
+      var newWrapperContents = newPage.querySelector('#' + element.id);
       element.innerHTML = newWrapperContents.innerHTML;
 
       if (UtilRegistry) {

static/js/utils/massInput.js

@@ -128,8 +128,8 @@
             accept: HttpClient.ACCEPT.TEXT_HTML,
           }).then(function(response) {
             return HtmlHelpers.parseResponse(response);
-          }).then(function(responseElement) {
-              processResponse(responseElement);
+          }).then(function(response) {
+              processResponse(response.element);
               if (isAddCell) {
                 reFocusAddCell();
               }

static/js/utils/modal.js

@@ -173,8 +173,10 @@
         headers: MODAL_HEADERS,
         accept: HttpClient.ACCEPT.TEXT_HTML,
       }).then(function(response) {
-        return HtmlHelpers.parseResponse(response, element.id);
-      }).then(processResponse);
+        return HtmlHelpers.parseResponse(response);
+      }).then(function(response) {
+        processResponse(response.element);
+      });
     }
 
     function processResponse(responseElement) {