Boolean in dynamic pages with text field

I have a dynamic page, on that page, there is a text field linked to boolean in the collection.
I need the text field to show “Yes” and “No” instead of True and False.

I looked up the solutions and found some from 2018 here, but it doesn’t work for me. Perhaps I do something wrong. If anyone could help me WHAT is that I’m doing wrong, it would be great.

Here is my example:

import wixData from 'wix-data';
export function text48_viewportEnter(event) {
    $w.onReady(() => {
        $w("#dynamicDataset").onReady(() => {
            const itemObj = $w("#dynamicDataset").getCurrentItem();
            if (itemObj.cellar) {
                $w('#text48').text = "Yes";
            } else {
                $w('#text48').text = "No";
            }
        });
    });
}

Your code seems to be → ok!
Did you connect your elements on your page with your dataset → using the property-panel ? → Then you’ll have a problem.

Propertypanel say → we will go to the left!
Code says → we will go to the right!

Property-Panel → WINNER!

I think my elements and dataset are connected. The text/number text works fine and it properly shows true/false on this “cellar”. I admit the other two booleans don’t work that well. I also can see this in the Properties item. I have to admit, it’s my first time with dynamic pages so maybe I don’t have it connected right?

The text field also shows “connected to data”.

The problem is → either you go the coding way, or you use the property-panel + dataset-connection.

A mix of both will cause – ERRORS → incompatible!

Since you want something what is custom, you will have to go the coding way.
This for you normaly will need to disconnect your element first and give it it’s functionalities by code, programming them by yourself.

One possible solution could also be this one, but not sure if it will work…

$w.onReady(function() {console.log("Page ready!");    
    $w("#dynamicDataset").onReady(()=> {console.log("Dataset ready!");
        const item = $w("#dynamicDataset").getCurrentItem();
        setTimeout(()=>{
            if (item.cellar) {$w('#text48').text="Yes";
            } else {$w('#text48').text="No";}
        },1000);
    });   

    $w('#text48').onViewportEnter((event)=>{
        //What do you wanna do on VieportEnter ???
        //Write your code here....
    });
});

Also i did not really understand → your → onVieportEnter-Code-Part.

Note: $w.onReady(function() {…}); ← always on the very top of your code, after imports!

You perhaps should consider to change your coding-style! Avoid connections in the property-panel!

3 Likes

@russian-dima This really helped, thank you!

1 Like

@aquaophiss No problem!