Dynamic page get boolean value from cms and display hide item if false

infernalviper11 · October 13, 2025, 6:14pm

I’m having trouble with
Using a boolean value in a cms collection to change if an item is displayed or not.

Working in
Wix Editor, Dev Mode, and CMS

What I’ve tried so far
I’ve followed this tutorial with a similar solution but it won’t work for me.
https://forum.wixstudio.com/t/solved-show-or-hide-element-in-dynamic-page-depending-on-boolean/25204/2

this code is being used on a dynamic item page which connects to the “important documents” cms collection.
this is my current code. the “ImportantDocuments” is my cms collection and the item.gallery is a boolean value to hide the #gallery1 piece on my page.

$w.onReady(() => {

$w("#ImportantDocuments").onReady(() => {

const item = $w(“#ImportantDocuments”).getCurrentItem();

if (!item.gallery) {

        $w("#gallery1").collapse();

    }

});

});

CODE-NINJA · October 13, 2025, 6:51pm


//*****USER-INTERFACE*****
const dynDataset = 'ImportantDocuments'; // <-- ID of your DYNAMIC-DATASET here.
const myGallary = 'gallery1'; // <-- ID of your GALLERY here.
//*****USER-INTERFACE*****

$w.onReady(() => {console.log('...page is ready...');
    // Wait for the dataset to load the current item
    $w(`#${dynDataset}`).onReady(() => {console.log('...dyn-dataset is ready...');
        const curItem = $w("#ImportantDocuments").getCurrentItem(); console.log('Current-Item: ', curItem);
        // Check the boolean field 'gallery'
        if (!curItem.gallery) {$w(`#${myGallary}`).collapse();} // Hide the gallery if false
        else {$w(`#${myGallary}`).expand();} // Show the gallery if true (optional)
    });
});


// Make sure your GALLERY-FIELD inside of your collection is a --> BOOLEAN-FIELD.

Clear code-version:


const dynDataset = 'ImportantDocuments'; 
const myGallary = 'gallery1'; 

$w.onReady(() => {
    $w(`#${dynDataset}`).onReady(() => {
        const curItem = $w("#ImportantDocuments").getCurrentItem();
        if (!curItem.gallery) {$w(`#${myGallary}`).collapse();}
        else {$w(`#${myGallary}`).expand();}
    });
});

// Make sure your GALLERY-FIELD inside of your collection is a --> BOOLEAN-FIELD.

Try this to make it maybe even more stable…

if (!Boolean(curItem.gallery)) {
    $w(`#${myGallary}`).collapse();
} else {$w(`#${myGallary}`).expand();}

infernalviper11 · October 13, 2025, 8:06pm

seeing this error. not sure why. its literally on the page connected to the collection

CODE-NINJA · October 13, 2025, 8:19pm

…then try it like …

const dynDataset = '#ImportantDocuments'; 
const myGallery = '#gallery1'; 

$w.onReady(() => {
    $w(dynDataset).onReady(() => {
        const currentItem = $w(dynDataset).getCurrentItem();
        const galleryField = currentItem.gallery;

        if (!galleryField || galleryField.length === 0) {
            $w(myGallery).collapse();
        } else {
            $w(myGallery).expand();
        }
    });
});

By the way → ImportantDocuments ← this is your → COLLECTION- ID, not so ?
It is not the dataset-ID, right?

Did you mixed up COLLECTION-ID and DATASET-ID ?

Try also to change from …
const dynDataset = ‘#ImportantDocuments’;
const myGallery = ‘#gallery1’;

…to…
let dynDataset = ‘#ImportantDocuments’;
let myGallery = ‘#gallery1’;

infernalviper11 · October 13, 2025, 8:54pm

I believe I was using the collection ID. I will try this fix. thank you

infernalviper11 · October 13, 2025, 9:06pm

I adjusted the code to the values. it at very least compiles.

CODE-NINJA · October 13, 2025, 9:09pm

I did a mistake.

Since you are using a dynamic dataset, normaly it should be like…

let dynDataset = '#dynamicDataset'; 
let myGallary = '#gallery1'; 

$w.onReady(() => {console.log('...page is ready...');
    $w(dynDataset).onReady(() => {console.log('...dynamic dataset is ready...');
        const curItem = $w(dynDataset).getCurrentItem(); console.log('Current-Item: ', curItem);
		if (!curItem.gallery) {$w(myGallary).collapse();}
        else {$w(myGallary).expand();}
    });
});

…or you do use → ‘#dynamicDataset’ ← in standard mode…

let myGallary = '#gallery1'; 

$w.onReady(() => {console.log('...page is ready...');
    $w('#dynamicDataset').onReady(() => {console.log('...dynamic dataset is ready...');
        const curItem = $w('#dynamicDataset').getCurrentItem(); console.log('Current-Item: ', curItem);
		if (!curItem.gallery) {$w(myGallary).collapse();}
        else {$w(myGallary).expand();}
    });
});

EDIT:

Ok, i tested this one on my own end and it worked without issues…

let dynDataset = 'dynamicDataset'; 
let myGallary = 'gallery1';

$w.onReady(()=> {console.log('...page is ready...');
    $w(`#${dynDataset}`).onReady(() => {console.log('...dynamic dataset is ready...');
	    const curItem = $w(`#${dynDataset}`).getCurrentItem(); console.log('Current-Item: ', curItem);
		if (!curItem.gallery) {$w(`#${myGallary}`).collapse();}
        else {$w(`#${myGallary}`).expand();}
    });
});

Important checkpoints:

using → let ← instead of const will prevent from errors.
using → dynamicDataset ← when working on a dynamic dataset → $w(‘#dynamicDataset’)
paying attention on how exactly you do your definitions…
a) either like…

      const dynDataset = '#dynamicDataset'; 
      const myGallary = '#gallery1';

    b) ...or like...

      const dynDataset = 'dynamicDataset'; 
      const myGallary = 'gallery1';

    c)  ...or like...

      let dynDataset = '#dynamicDataset'; 
      let myGallary = '#gallery1';

    d)  ... or like ...

      let dynDataset = 'dynamicDataset'; 
      let myGallary = 'gallery1';

… so also reacting accordingly…
1) …either like —> $w(dynDataset)

…or you do it even better → directly <— like …

let dynDataset = $w('#dynamicDataset'); 
let myGallary = $w('#gallary1');

$w.onReady(()=> {console.log('...page is ready...');
    dynDataset.onReady(() => {console.log('...dynamic dataset is ready...');
	    const curItem = dynDataset.getCurrentItem(); console.log('Current-Item: ', curItem);
		if (!curItem.gallery) {myGallary.collapse();}
        else {myGallary.expand();}
    });
});

infernalviper11 · October 13, 2025, 10:41pm

CODE-NINJA:

let dynDataset = 'dynamicDataset'; 
let myGallary = 'gallery1';

$w.onReady(()=> {console.log('...page is ready...');
    $w(`#${dynDataset}`).onReady(() => {console.log('...dynamic dataset is ready...');
	    const curItem = $w(`#${dynDataset}`).getCurrentItem(); console.log('Current-Item: ', curItem);
		if (!curItem.gallery) {$w(`#${myGallary}`).collapse();}
        else {$w(`#${myGallary}`).expand();}
    });
});

that worked! its functioning now!!! thanks so much!

CODE-NINJA · October 14, 2025, 6:27pm

No problem you are welcome.
bcabb205-05fd-443e-ad70-6244b69b6194

Rob · October 14, 2025, 7:18pm

Don’t forget if it worked and solved the issue, mark the solution. It helps @CODE-NINJA and adds to the SEO that this is the solution to the question.

Great work as always Code-Ninja as well by the way.

CODE-NINJA · October 14, 2025, 7:25pm

Thank’s!
Normaly i should have resolved it withing minutes, but this long way to solution was the result of not using the DATASET (especially the dynamic one) for decades → you know, i like to generate everything by code → Wix-Data is what i like

Rob · October 14, 2025, 7:46pm

There’s something nice about seeing the process for various option so no worries there and @infernalviper11 got their solution in the end.

system · November 13, 2025, 7:47pm

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

Topic		Replies	Views
Collapsed element acording boolean value. Ask the community code , question	3	606	December 9, 2017
Checking if boolean in collection is true then... Ask the community code , question	3	3691	October 2, 2018
SOLVED Show or hide element in dynamic page depending on boolean Ask the community code , question	3	2106	January 1, 2022
UnHide based on boolean value Ask the community code , question	3	735	June 7, 2018
How to make an Icon be visible if a bolean field is true, and hide if that same field is false? Ask the community code , cms , question	10	858	August 25, 2021

Dynamic page get boolean value from cms and display hide item if false

EDIT:

…or you do it even better → directly <— like …

Related topics