Question

在plone 5页面模板中假设以下愚蠢的代码片段：

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

<input id="bar" />

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

您将获得两个输入。第一个是很好的日历输入，第二个是开始时为空。单击第二个输入后，其类将设置为“pat-pickadate” - 与第一个类似 - 但不会呈现日历。

我在试图找到原因时遇到了这个问题，为什么我的jquery-UI叠加显示plone添加，编辑视图不再（Plone5）显示日历小部件。

这种行为是否有意？如果是这样，在Plone 5中通过AJAX调用动态获取的表单中使用模型小部件的正确方法是什么？是否有一些神奇的召唤来通知Mockup机制改变DOM？

我读到Mockup有自己的叠加技术，但很难重写大约600行复杂的JS代码，只是为了得到一个简单的小部件。

我无法找到有关此主题的任何文档或示例。有人能把我放在正确的方向吗？

Answer 1

模式在加载时初始化，如果DOM更改并包含应该使用模式呈现的新元素，则需要调用Registry.scan。

要做到这一点，您需要像这样更改脚本：

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

脚本不能内联，因为没有任何保证已经加载了JQuery和/或require。因此，将您的代码放在一个单独的JS文件中，并确保使用以下两种方法之一将其加载到您的页面中：

将您的文件放入Diazo主题并在<script>中添加index.html标记（如果您正在开发主题模块，则更喜欢此方法）
将您的脚本直接声明为registry.xml中的编译包，请参阅https://github.com/collective/example.p4p5/blob/master/src/example/p4p5/profiles/plone5/registry.xml（如果您正在开发附加模块，则更喜欢这种方法）

Plone5 Mockup Widgets就像pat-pickadate不适用于动态生成的内容

1 个答案: