From 704f21899da4b48c79962115116e7cde0c0d7c19 Mon Sep 17 00:00:00 2001
From: Koen Reefman <koen.reefman@aareon.nl>
Date: Thu, 15 Jun 2017 14:23:17 +0000
Subject: [PATCH] SGGR#38472 mobile collapsible block validatie verbetert en
 sluit nu block correct af

svn path=/Website/trunk/; revision=34298
---
 APPL/Localscripts/iface.js     | 11 +++++++++++
 APPL/Shared/kenmerk_common.inc | 28 +++++++++++++++++++---------
 2 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/APPL/Localscripts/iface.js b/APPL/Localscripts/iface.js
index cb317dd3f7..56bf4ba9fb 100644
--- a/APPL/Localscripts/iface.js
+++ b/APPL/Localscripts/iface.js
@@ -311,6 +311,17 @@ function validateForm(fName, params)
   if (params.relaxed)
     clsName = "";
 
+  // Onderstaand stukje klapt mobile collapsible blocks uit indien er zich een input veld met waarde in bevind.
+  $(".ui-body-c").each(function () {
+
+    var $collapsable = $(this);
+    $(this).find("input.required").filter(':hidden').each(function() {
+
+      if ($(this).val() && $collapsable.prev(".ui-collapsible-heading-collapsed"))
+        $collapsable.prev(".ui-collapsible-heading-collapsed").trigger("click");
+    });
+  });
+
   if (hasBadFields())
   {
     validatorHint.push(L("lcl_shared_validator_invalid"));
diff --git a/APPL/Shared/kenmerk_common.inc b/APPL/Shared/kenmerk_common.inc
index adc775a9cd..b428c70b50 100644
--- a/APPL/Shared/kenmerk_common.inc
+++ b/APPL/Shared/kenmerk_common.inc
@@ -279,7 +279,8 @@ function listKenmerk(sql, module, key, props)
     var kenmerkidref = new Array(); // Bijhouden welk kenmerk welke id referentie mee heeft gekregen
     var dpYearRanges = [];          // te gebruiker jaren voor datepicker vastleggen.
 
-    var allCollapsable = false;     // true bij eerste 'l'-label
+    var allCollapsable = false; // true bij eerste 'l'-label
+    var inMobileBlock = false;  // true van begin mobile-collapse-content tot eind mobile-collapse-content
 
     var kenmerk_2col = (flexcolumns >= 2); // 2 kolommnen voor flexkenmerken als aantal kolommen ingevuld 2 of meer is.
 
@@ -1344,7 +1345,8 @@ function listKenmerk(sql, module, key, props)
       // KENMERKTYPE L (Label) ====================================================================
       if (ktype == 'L' || ktype == 'l')
       { // Label line
-        allCollapsable = (ktype == 'l'); // opnieuw beginnen met zoeken
+        allCollapsable  = (ktype == 'l');            // opnieuw beginnen met zoeken
+        inMobileBlock = (formobile && ktype == 'l'); // op dit moment zitten we in een mobile-collapse-content-block
 
         val_label = oRs("kenmerk_omschrijving").Value;  // was: 1
         clabelCounter++;
@@ -1395,11 +1397,10 @@ function listKenmerk(sql, module, key, props)
 
         if (!formobile && !nolabel)
           kenmerk_write('<td class="label' + (ktype == 'L' || ktype == 'l'? ' flexlabel' : '')+ (kenmerk_search? ' flexsearch' : '') + '"'
-                      + (props.label_colspan? ' colspan=' + props.label_colspan : '')
-                      + '>');
+                      + (props.label_colspan? ' colspan=' + props.label_colspan : '') + '>');
 
         if (!nolabel)
-          kenmerk_write((formobile && ktype == 'l'? '<div data-role="collapsible" data-theme="c" data-content-theme="c"><h3>' : '')
+          kenmerk_write((formobile && ktype == 'l'? '<div data-role="collapsible" data-theme="c" data-content-theme="c"><h3 id="collLabel'+clabelCounter+'">' : '')
                       + '<label for="' + nameprefix + idCounter + 'val" class="label' + (ktype == 'L' || ktype == 'l'? ' flexlabellabel' : '')
                       + (isExpression ? ' expression' : '') + '">' + '<span title="' + safe.htmlattr(hint) + '">'
                       + val_label + ((kdim != null && kdim != "xxx")? ' [' + kdim + ']' : '') + val_seperator + '</span></label>'+(formobile && ktype == 'l' ? '</h3>' : ''));
@@ -1472,20 +1473,29 @@ function listKenmerk(sql, module, key, props)
       oRs.MoveNext();
 
       // Collapse code er achteraan als de *volgende* een ander label is
-      if (allCollapsable && (oRs.Eof || oRs("kenmerk_kenmerktype").value.toUpperCase() == 'L')) // einde huidige label
+      if ((inMobileBlock || (!formobile && allCollapsable)) && (oRs.Eof || oRs("kenmerk_kenmerktype").value.toUpperCase() == 'L')) // einde huidige label
       {
         if (formobile)
-            kenmerk_write('</div>');
+        {
+          kenmerk_write('</div>');
+          inMobileBlock = false;
+          if (!allCollapsable) // the current collapseBlock should be expanded
+            kenmerk_write('<script> $(document).ready(function(){ $("#collLabel'+clabelCounter+'").trigger("click"); });</script>');
+        }
         else
-            kenmerk_write('<script>$(document).ready(function(){$("#' + nameprefix + 'clabel' + clabelCounter + '").addClass("flexcollapsed").nextUntil($("#' + nameprefix + 'clabel' + (clabelCounter + 1) + '")).hide();})</script>');
+          kenmerk_write('<script>$(document).ready(function(){$("#' + nameprefix + 'clabel' + clabelCounter + '").addClass("flexcollapsed").nextUntil($("#' + nameprefix + 'clabel' + (clabelCounter + 1) + '")).hide();})</script>');
         allCollapsable = false;
       }
     }
     oRs.close();
-    if (allCollapsable) // allerlaatste ook nog
+    if (inMobileBlock || (!formobile && allCollapsable)) // allerlaatste ook nog
     {
         if (formobile)
+        {
             kenmerk_write('</div>');
+            if (!allCollapsable) // the current collapseBlock should be expanded
+              kenmerk_write('<script> $(document).ready(function(){ $("#collLabel'+clabelCounter+'").trigger("click"); });</script>');
+        }
         else
             kenmerk_write('<script>$(document).ready(function(){$("#' + nameprefix + 'clabel' + clabelCounter + '").addClass("flexcollapsed").nextUntil($("#' + nameprefix + 'clabel' + (clabelCounter + 1) + '")).hide();})</script>');
     }