Dmx-show not working initially

Wappler General How To
#1

When I use dmx-show to show/hide content from a datasource, the code is shortly shown on the page.

For example I have no records in the news dataview, but “No records in database.” shows up for a short time and then disappears. I’m using this code.

 <div class="row py-4" dmx-show="!dvNews.data.hasItems()">
        <div class="col-md-9">
          <p>No records in database.</p>
        </div>
      </div>

Looks like the DMXZone code is executed after the html code. How can I improve this?

#2

Have you tried

<div class=“row py-4” dmx-hide=“dvNews.data.hasItems()”> <div class=“col-md-9”> <p>No records in database.</p> </div> </div>

#3

Thanks Ben, yes, that doesn’t fix the problem. The html code is written before the code is being executed.

#4

do you have a live example that we can check?

#5

Can I send you the link as a pm?

#6

change it to something like this

dmx-hide=“dvNews.data.hasItems() || dvNews.state.executing”

1 Like
#7

This works. I had given up on this thinking there was no option. Thanks. :+1:

#8

Doesn’t work for me…

#9

btw what is the correct syntax?

dmx-show=“dvDokumente.items”
or
dmx-show=“dvDokumente.data.hasItems()”

?

#10

Well it seems like you are just checking the wrong data…

You should just pick the expression containing the data that you are usually going to repeat, like:

add Show on:

image
image.png459×675 24.4 KB

In the formatter selection conditional / hasItems

image
image.png459×680 24.1 KB

final expression:

image
image.png463×675 24.4 KB

#11

What about the data in the dataview? Can’t I use them to show/hide? As I am filtering the data view, it doesn’t make sense for me to show hide the server connect

#12

Yes indeed you can show/hide on dataview data as well.
With data view it is even easier as you can check directly the items under it.

so you can use:

dmx-show="dataviewName.data.hasItems()"
or
dmx-show="dataviewName.items > 0"

or with specific number of items:
dmx-show="dataviewName.items > 5"

#13

Do I have to use

dmx-show="dataviewName.items > 0"
or is this also ok:
dmx-show="dataviewName.items"

#14

Back to the main problem of the post, do you have a solution for it?

#15

yes both should work.

I checked your page you send me on PM - and can’t see what is not working. You have one record so everything shows as it should

#16

When you (re)load the page you can see the placeholdertext for no records:

“Es wurde kein Datensatz gefunden.”

That’s the problem :slight_smile:

#17

oh that - is just a flash in the beginning - because you don’t have the data yet - and initially the region is visible. So just make sure that is initially hidden with css set it’s display to none - that is all :slight_smile:

and when the data is loaded and there is no data - it will be made visible by dmx-show

#18

So I have to toggle an additional class with display:block to the region to show it if necessary?

#19

No that is what dmx-show will do later - you just have to make sure that initially - the browser dosn’t show the element - by having it in the css with display none. Make a class for it or just add inline style:

style="display:none"

#20

and actually for the most easiest solution - just apply the page loader - that waits will all data is loaded first:

So they you will avoid any flashing