Plone5 Mockup Widgets wie Pat-pickadate nicht für dynamisch generierten Inhalt arbeitet

Question

Angenommen, das folgende dumme Codefragment in einer Plone-5-Seite Vorlage:

<input id="foo" class="pat-pickadate" /> 

<input id="bar" /> 

<script type="text/javascript" > 
     $('#bar').click(function() { 
      $('#bar').addClass("pat-pickadate"); 
     }); 
</script> 

Sie werden zwei Eingänge erhalten. Die erste ist eine schöne Kalendereingabe und die zweite ist beim Start leer. Nach dem Klicken auf die zweite Eingabe wird ihre Klasse auf "pat-pickadate" - wie die erste - gesetzt, aber es wird kein Kalender gerendert.

Ich stieß dabei auf den Grund zu finden, warum meine jquery-UI Overlays anzeigen plone hinzufügen, und bearbeiten Ansichten nicht mehr (Plone5) zeigen Kalender Widgets überhaupt.

Ist dieses Verhalten beabsichtigt? Wenn ja, wie kann man Mock-Up-Widgets in Formularen verwenden, die von AJAX-Aufrufen in Plone 5 dynamisch abgerufen werden? Gibt es einen magischen Aufruf, die Mockup-Maschinerie der DOM-Änderung zu informieren?

Ich habe gelesen, dass Mockup seine eigene Overlay-Technik hat, aber es ist schwer, einige 600 Zeilen komplexen JS-Code umzuschreiben, nur um ein einfaches Widget richtig zu bekommen.

Ich konnte keine Dokumentation oder Beispiele zu diesem Thema finden. Kann mir bitte jemand die richtige Richtung zeigen?

Answer 1

Muster werden beim Laden initialisiert, wenn sich Ihr DOM ändert und neue Elemente enthält, die mit einem Muster gerendert werden sollen, müssen Sie Registry.scan anrufen.

, es zu tun, müssen Sie Ihr Skript wie folgt ändern:

require([ 
    'jquery', 
    'pat-registry' 
], function($, Registry) { 
    $('#bar').click(function() { 
     $('#bar').addClass("pat-pickadate"); 
     Registry.scan($('#bar')); 
    }); 
}) 

Das Skript muss nicht inline, denn nichts garantiert, dass JQuery und/oder benötigen, sind bereits geladen. setzen Sie Ihren Code also in einer JS-Datei getrennt, und sicherstellen, dass es in Ihrer Seite mit einer dieser zwei Möglichkeiten geladen wird:

• setzen Sie Ihre Datei in Ihrem Diazo Thema und fügen Sie einen <script> Tag in Ihrem index.html (bevorzugen diese Methode, wenn Sie ein Thema Modul entwickeln)

• erklären Ihr Skript direkt als kompilierte Bündel in registry.xml finden https://github.com/collective/example.p4p5/blob/master/src/example/p4p5/profiles/plone5/registry.xml (bevorzugen diese Methode, wenn Sie ein Add-on-Modul entwickeln)

Letzte Frage

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 Verwandte Themen

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.