yes/no fields in database

Hi guys,

I am doing a holiday rental site and would like to list all the amenities depending on what they have. Would there be a way to have a field called say ‘pool’ and have yes or no, then display in my repeaters only if there is a yes with an image of a pool? Cheers

I see it is probably booleans, but not sure how to display these please? I will have 2 pool icons (1 grey and 1 black) and if the boolean is ticked then it would show the black, else the grey one. Look forward to your help please!

Hey,
You can hide both of the images on load and use the show and hide function to show only the relevant one:

if (pool === "true"){
    $w('#coloredPoolImage').show();
}
else{
    $w('#greyPoolImage').show();
}

Should the issue persists, please send us the site URL, the page name and the code you’ve written so that we can better understand what is the scenario.

Best,
Tal.

Leighton, I am doing more or less the same and there are two ways to do it:

  1. on input level: when you define the property in your form, you can use the .onBeforeSave event to check if pool===true and set the image URL for the dark one in a separate image field, else the grey one. Advantage is that you do not have to code on output level. Disadvantage is that you might run into data inconsistency
  2. on output level (=repeater). You can do what Tai suggested above. Downside is that you have to put both images at design time OVER each other to show 1 of them in the same location. Other option is to put the grey one at design time in its place and in code check if the boolean is true. If, so you change the .src to the black one.
    Hope this helps.
1 Like

Thanks guys. I’m sorry but I am very new to this and just need the layout of the code. Is it something like this, because it has a lot of errors:

import wixData from ‘wix-data’;
$w.onReady( () => {
$w(“#dataset1”).onReady( () => {
let item = $w(“#dataset1”).getCurrentItem();
if (Pool === “true”){
$w(‘#shape4’).show();
}
else{
$w(‘#shape5’).show();
}
}
} );
} );

my site is http://tailoredwebdesign.wixsite.com/book-the-best and this page is caleed ‘Queensland’. TIA!

Try this;

let item = $w(“#dataset1”).getCurrentItem().pool;
if (item=== “true”){

assuming that the field name (prob. a boolean) in the collection is called ‘pool’.

Oh, and another thing. If it doesn´t work, try dropping the quotes around “true”. As far as I know, you should test ion true, not “true”. It´s not a string.

1 Like

Thanks for your help Giri. It is showing an image, but the wrong one (and I have swapped them!). It does give me 'WixData is unused error though??

import wixData from ‘wix-data’;
$w.onReady( () => {
$w(“#dataset1”).onReady( () => {
let item = $w(“#dataset1”).getCurrentItem().pool;
if (item===true){
$w(‘#shape4’).show();
}
else{
$w(‘#shape5’).show();
}
} );
} );

Are you sure shape4 and 5 are both defined at design time (property panel) as ‘hidden on load’?

yes definitely! So close as it shows the image but I have one turned off for testing and they all show exactly the same. Thanks for your time

This is the moment where I start putting in console.log ´s to see where the logic goes wrong. Put one in the if , and one in the else and see what happens.

Tal could u assist? Also these are repeaters btw

import wixData from ‘wix-data’;
$w.onReady( () => {
$w(“#dataset1”).onReady( () => {
let item = $w(“#dataset1”).getCurrentItem().Pool;
if (item===true){
$w(‘#shape4’).show();
}
else{
$w(‘#shape5’).show();
}
} );
});