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

Dr.*_*sch 6 javascript ajax plone requirejs plone-5.x

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

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

<input id="bar" />

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

你会得到两个输入.第一个是很好的日历输入,第二个是开始时为空.单击第二个输入后,其类将设置为"pat-pickadate" - 与第一个类似 - 但不会呈现日历.

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

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

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

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

ebr*_*ult 3

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

为此,您需要像这样更改脚本:

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

该脚本不得内联,因为无法保证 JQuery 和/或 require 已加载。因此,将代码放入单独的 JS 文件中,并确保使用以下两种方式之一将其加载到页面中:

  • 是的,你的 JS 代码一定不能是内联的,因为无法保证 JQuery 和/或 require 已经加载。因此,将您的代码放在一个单独的 JS 文件中,并将其添加为资源(或者您也可以将其放在 Diazo 主题中并将其加载到您的 index.html 中)。 (2认同)