Coded repeater

Problem loading image into a coded repeater

I have a database with several fields, one of them an image field


I’ve coded 4 dropdown boxes with the help of the example of Code Queen (many thanks) that presents the result on a textbox, and I wood like to display a single image on the repeater, associated to the result of that textbox:

I tried this code without result…image on the repeater does not load the image associated to this line

import wixData from ‘wix-data’ ;

export function button1_click ( event ) {
search ()
}
function search ( ) {
wixData . query ( “CrashBars” )
. contains ( “referencia1” , String ( $w ( “#textBox1” ). value ))
. find ()
. then ( results => {
$w ( “#repeater9” ). data = ;
$w ( “#repeater9” ). data = results . items ;
});

}

Any sugestions/help??

1 Like

Your question is not clear enough.
How do you bind the data to the repeater in the first place? Via dataset?
Is the data collection for the repeater different than the collection where the image is stored?
If they’re different collections, why don’t you connect them using a reference filed type (and you preferred a text field instead)?
Is the imagem value the value what you need?

J. D. many thanks to your prompt answer…
Answering your questions:
How do you bind the data to the repeater in the first place? Via dataset?

  • Do I have to bind the repeater via dataset, or can I code it?
  • Data collection to the repeater is the same where the image is stored.
  • imagem is the field name, not the value.

@fmontana71 It doesn’t really answer the questions.

  1. You can get the data either via a dataset or by direct query code, the question was how did you do it?

  2. I can’t see the 4 image fields in your collection screenshot.

@J.D. please note the query:

function search ( ){ wixData . query ( “CrashBars” )

. contains ( “referencia1” , String ( $w ( “#textBox1” ). value ))
. find (). then ( results =>
{ $w ( “#repeater9” ). data =;
$w ( “#repeater9” ). data = results . items ;});}

in this image please note the most right field name “Imagem” with field name “imagem”

Sorry, I still don’t understand.
Maybe try to explain in other words and add more details.

@J. D. please note published site

https://paixaomotardporto.wixsite.com/paixao-motard/basic-01

if you chose AJP in the first dropbox the other ones will populate and retrieve a reference on textbox1…depending on that reference, repeater should load an image associated to that specific reference.

Please explain:

  1. Where is the repeater? I can only see a box with some dropdowns.

  2. Is the image inside a repeater? If it is, why do you use a repeater if you only display one image at any given time?

  3. How did you connect the repeater to the dataset?
    Add as many details as possible, because it’s hard to understand what you’re doing there.

J. D. the repeater is on the right side of the dropboxes…
The dropboxes will reflect a user information that will lead to a distinct reference displayed in the textbox (read only). For each reference I would like to display a photo and only one photo that will change as reference in the textbox changes…

TTT

So why do you use a repeater? A repeater should be used for repeating items and you only display a single image. Why wouldn’t you just use a dynamic image (based on the user input) without a repeater?

@jonatandor35 Finally I understand what you are saying…please forgive me, because I’m newbie in JS…so, I tried your solution…I put an image field, connected to a dataset (“CrashBars”) that filters images from the dataset based on dropdown named “cor”. It works for the first records…it loads the photo that corresponds to the dropdown choice…but now I have another problem…the choices from that dropdowns repeats over and over along my dataset…so if I change the other 3 dropdowns, and choose some choice from the dropdown “cor”, it loads the first photo that corresponds to that choice…
Can I, somehow filter the image result based in more than one filter??