j_accordion & formulare

[marq]

Servus,

nach längere Pause, darf ich mich mal wieder mit Contao beschäftigen und benötige ein klein wenig Hilfe, bzw. vielleicht hat je jemand ein Lösungsansatz.

Zum Problem: Ich habe mehrere Accordions angelegt, in denen sich jeweils ein Formular versteckt... nun ist es so, das ich halt bei einer Fehlermeldung, also Sprich wenn ein Pflichfeld nicht ausgefüllt wurde, dass entsprechende Accordion aufgeklappt sein soll.

Mein Ansatz: Der code schließt generell alle Accordions per default. Wenn denn dann Fehler innnerhalb eines Formulars auftritt, wird innerhalb des Accardions die klasse ".formerror" hinzu gefügt - soweit so gut ... irgendwie komme ich gerade nicht darauf, wie ich dann nur das eine bestimmte Accordion wieder aufklappe, welches durch die klasse ".formerror" erweitert wurde..

<script>
  (function($) {
    $(document).ready(function() {

      $(document).accordion({
        // Customs
        heightStyle: 'content',
        header: 'div.toggler',
        collapsible: true,
        
        // Alle Akkordeons eingeklappt
        active: false,
        create: function(event, ui) {
          ui.header.addClass('active');
          $('div.toggler').attr('tabindex', 0);
        },
        activate: function(event, ui) {
          ui.newHeader.addClass('active');
          ui.oldHeader.removeClass('active');
          $('div.toggler').attr('tabindex', 0);
        }
      });
        // Fehlerklasse hinzufügen bei Form .error
      $('.accordion').each(function(index, element) {
        var $element = $(element);
        if ($element.find('.error').length > 0) {
        $element.addClass('formerror');
         }
        });

    });
  })(jQuery);
</script>

[07alex07]

Die Klasse active musst du dem accordion mitgeben beim Fehler. Dann bleibt es offen

[marq]

Nach einen kleinen Mittagsschläfchen bin ich doch ein Stück, bzw. soweit gekommen das es funktioniert - ist vielleicht nicht die eleganteste Lösung aber zu mindesten eine Lösung die funktioniert.

<script>
(function($) {
  $(document).ready(function() {

   // Alle ersteinaml zuklappen
    $(document).accordion({
        heightStyle: 'content',
        header: 'div.toggler',
        collapsible: true,
        active: false,
        create: function(event, ui) {
          ui.header.addClass('active');
          $('div.toggler').attr('tabindex', 0);
        },
        activate: function(event, ui) {
          ui.newHeader.addClass('active');
          ui.oldHeader.removeClass('active');
          $('div.toggler').attr('tabindex', 0);
        }
      });

      // Akkordion wieder aufklappen, falls dort ein Fehler nach dem POST aufkam.
      $('.accordion').each(function(index, element) {
        var $element = $(element);
        if ($element.find('.error').length > 0) {
          $(document).accordion('option', 'active', index); 
          }
      });
  });
})(jQuery);
</script>

Für die Suche: jQuery, Formular, Accordion, Formulargenerator, Formular, Fehlerbehandlung.