How can I get a default image

I am running a query which lists the file and then in the image slider I am filtering on ‘whatever’ this all works fine, however if there is no image to show in the image slider I need it to default to an alternative picture.
Any suggestions on how to do it, I have tried a ‘hide on’ but the problem is the file list always has items.

Example page:
http://testing2019.thegunnery.com.au/4668/guns-and-ammo/shotguns/akkar-3-12g-20inch-3-shot-black-synthetic-extractor-/

You can store the filtered collection in a variable and then use that for the slideshow and to check if it has items.

Depending on if the query returns null or an empty string in a no image situation you can use

{{imagename==’’?imagename:‘defaultimagepathandname’}}

or

{{imagename==Null?imagename:‘defaultimagepathandname’}}

1 Like

are you loading the product information and the image data in the same query or separate ones?

Problem is the query does not return an empty list as the file list is populated with all the images and then filtered by .where(name, serverconnect1.data.query1[0].Barcode, “contains”)

So it does not return an empty list. I need to somehow, if the files DON’T include Barcode then show. but can get it to work

got the image slider loading with #serverconnect1.data.folderList1.where(name, serverconnect1.data.query1[0].Barcode, “contains”)#
The product info come in on the same query but filters the product id in the URL:
So: Url - (1)Filter Product - (2)Image filtered by Barcode from selected product (1)

If that make any sense.

I get what you thinking is that done in the server action?

Sorry peter, You are stating to,lose me now.

So the data query is filtered and returns the product data and the images in a single record. How are the multiple images stored within 1 record or am i misunderstanding?

Can you give me an example of exactly what data is returned…
My suggestion above was based on the Image Source attribute of the swiper

Like I said, put it in a value first.

<dmx-value id="filteredData" dmx-bind:value="serverconnect1.data.query1[0].Barcode, 'contains')"></dmx-value>
<div is="dmx-if" dmx-bind:condition="filteredData.value.hasItems()">
  <dmx-slideshow id="slideshow1" dmx-bind:slides="filteredData.value" slide-url="product-images/{{name}}" show-paging="true"></dmx-slideshow>
</div>

Have tried that @Patrick (forgive me if I’m sound dumb)
problem is with that @Patrick the database with the products will have an entry, however on the program that they all get put first (POS System) some may not have images.
The image is saved as the barcode number. So the filter somehow needs to be on the ‘list file’.
I can get the slider working but the only issue is when there is no images.
With the ‘if’ statement it will have a barcode. So that’s not working.
I’ve added the code you sent over, but it now shows the default image on all of them and non of the images in the slider

No the product data returns one record, e.g. ABC123
The ‘file list’ returns all the images that are in the /product-images. eg ABC123_1, ABC123_2, etc
which is then filtered (contains) by the barcode name from the record (eg ABC123)

I think the issue is I need to filter the ‘file list’ so it does not return the entire list of the folder.

Don’t worry its confusing me as well. The problem is the data is taken from a POS system and the way they have done it is stupid (I assume to force people to use only their software) But I am determined to get it working (hopefully within my lifetime :slight_smile: )

I’m sure you already have good suggestions, but in case it’s of interest, I’ve used another approach for this situation. In Server Connect, I use a repeat after the query to determine if a related file exists:

The JSON returned for the repeat is:

image

… which I can use in AppConnect for the conditions, eg:

dmx-hide="!sc_search.data.checkImg[$index].fileExists"

The Set Value line is not doing anything useful but I think something has to be there.

seems that I didn’t copy the expression correctly from you, it was missing the first part. I hope it is correct now.

<dmx-value id="filteredData" dmx-bind:value="serverconnect1.data.folderList1.where('name', serverconnect1.data.query1[0].Barcode, 'contains')"></dmx-value>
2 Likes

Cheers @patrick that did the trick :slight_smile:

Patrick I have a page that lists the records: when the image field is null, I would like to use a default image (present in the assets folder)
I tried to adapt the code you posted, but to no avail
Can you tell me how I set it up correctly?
Thanks

currently it is so
<img class="card-img-top img-fluid" alt="imageFile" dmx-bind:src="/galleries/{{IDProduct}}/{{imageFile}}">

Marzio, you can use the default formatter to do this.

The problem is that with PHP I always did it without problems, but with Wappler Formatter in this case I lost a little
Should I use Conditional if region?

There is a formatter called Default, so use it - as i mentioned in my last post.

Ok Teodor
but I have an Image associated with a template that includes the path
/gallery/{{IDProduct}}/{{imageFile}}
and I must to redirect to another path “/assets/nophoto.jpg”
and if I recall the formatter nothing appears

Then use the ternary operator:

dmx-bind:src="imageFile ? '/gallery/'+IDProduct+'/'+imageFile : '/assets/nophoto.jpg'"
1 Like

Magnificent and simple wow
Thanks Teodor