Jquery and dynamic content

Here’s my problem:
Dynamic content constructed with a repeat should be shortened in length by a jquery plugin (“collapser.js”). This plugin is initialized with a function (“collapse();”).
In Dreamweaver I added this initialization on repeat

> (<div class="sprach-block" id="repeat3" is="dmx-repeat" dmx-bind:repeat="serverconnect1.data.query1" onupdated="collapse();">...</div>)

This works. Even if I open the page in Wappler.
But if I rebuild the same in Wappler in a new page (with Bootstrap 4 instead of Bootstrp 3), it doesn’t work. (<div class="col-6" dmx-repeat:repeatimgespraech="serverconnect1.data.query1" onupdated="collapse();"> .... </div>).
What can I do?

Hello,
What exactly is not working?
Please make sure to include the full jQuery version on your page if you are using plugin which require it. This can be done using the frameworks menu.

The plugin should shorten the number of lines of dynamic content. But that’s not working. There is no result.
But it works on the same page with static content. Both jquery and the plugin are embedded correctly.
Amazing is that the whole thing works with almost identical code on the old site built in Dreamweaver.

Make sure jQuery full version is included and not the slim version which comes by default with bootstrap 4.

It’s the full version.
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" crossorigin="anonymous"></script>

Please provide a link to your page where we can check what are you doing exactly.

Dreamweaver constructed site: https://feldmannprojekte.ch
Wappler constructed site: https://feldmannprojekte.ch/test/index.php

Where should the collapse() function be defined?
This file is totally empty:
<script type="text/javascript" src="js/collapse.js"></script>

This is the file on wappler-created page:
https://feldmannprojekte.ch/test/js/collapse.js

Wrong file. Now it is the correct file. Doesn’t change anything.

Your script targets non-existing classes:
.text1, .text6, .text9, .text12

The class .text1 ist part of the dynamic content. The other classes will be used if I continue to build the site.
You see the class .text1 in Chrome.

Please instead of using repeat region on the div, apply repeat-children to its parent. It should fix the issue.

<div class="d-flex justify-content-between col-12 flex-wrap"> 
                        <div class="col-6" dmx-repeat:repeatimgespraech="serverconnect1.data.query1" onupdated="collapse();">
                            <h3 dmx-html="titel">Titel</h3>
                            <p dmx-html="inhalt">TEST </p>
                        </div>
                    </div>

Thank you. It’s working.

1 Like