Show a default image if no image exists in the database

Wappler General How To
#1

I know this is an older thread but I have a question in direct context to it so I thought I’d pitch in here - hope that’s OK…

Is there an option to show something if the condition hasn’t been met? I have a db record that may or may not show an image, I’m using a conditional region to show an image if the image name exists in a DB field, however Id like to show a default image if there is no DB field present.
I’m thinking something instead of having: is=“dmx-if” then can we have: is=“dmx-elseif”

Conditional region as conditional region attribute
#2

For images you don’t need a conditional region.
Just a dynamic image source and use the default formatter. Example:

dmx-bind:src="dynamic_image.default('/path/to/static_image.jpg')"
#3

heres what I’m using for the dynamic image:
<img class="card-img-top rounded img-fluid img-thumbnail" src="" id="card1" width="100px" height="100px" dmx-bind:src="'/images/articles/'+ArticleImageURL.default('/images/apple-icon-72x72.png')" dmx-bind:alt="ArticleAuthor">

This works fine for all records that have image data in the field, however If the ArticleImageURL field is empty I’m getting a missing file in its place…

#4

What do you mean by empty? Is it an empty string or is it null?

#5

It’s an empty string

#6

Try using:

dmx-bind:src="ArticleImageURL ? '/images/articles/'+ArticleImageURL : '/images/apple-icon-72x72.png'"

Or

dmx-bind:src="ArticleImageURL != '' ? '/images/articles/'+ArticleImageURL : '/images/apple-icon-72x72.png'"
1 Like
Default Image Source vs Dynamic Image Source
#7

Both of them worked @Teodor …!

Many thanks for that, I’ve been banging my head against the wall for three hours with this one!

Really appreciate your help.

1 Like
#8

I’m getting an issue in the version of Wappler (4.9.0) around the default image.

I have the following condition;
‘…/imageuploads/sm_’+image_name.default(‘nopic.png’)

This works correctly in the live preview mode within Wappler but if I view in web browser none of the images show and in the page inspector there is no dynamic data that should be showing the name of my image.

If I used as suggested by Teodor;
dmx-bind:src=“image_name ? ‘…/imageuploads/sm_’+image_name : ‘…/imageuploads/nopic.png’”

Everything works correctly but is not achievable without hand coding which is exactly what I don’t want to have to do in Wappler…

any ideas what I’m doing wrong.

#9

Sorry but is this working or not?

And if it’s not working, then what’s the problem exactly?

#10

This does not work;
‘…/imageuploads/sm_’+image_name.default(‘nopic.png’) in web browser but works in live preview mode Wappler. The above is generated by Wappler using dynamic attribute > image source > data bindings > data format.

This works but has to be hand coded…
dmx-bind:src=“image_name ? ‘…/imageuploads/sm_’+image_name : ‘…/imageuploads/nopic.png’”

#11

Well the .default formatter is used for different purposes. You can build the working expression logic also using the formatter and the ternary operator.

#12

OK, thanks

#13
#14