Collapse or Hide depending on boolean in DB

Ask the community
, ,
1

Hi everyone,

I am looking for the simpliest way to collapse or expand an element on a dynamic page, depending on a boolean in the database.

In my collection, I have 2 restaurants. One use a specific delivery service, and the other one don’t. So I have two columns in the database with boolean, where it is checked when needed or unchecked.
The collection I need to access is called “Services”
The columns names are : “Delivery”, and “Nodelivery”
The elements names are : “DeliveryBox” and “NodeliveryBox”

I am looking for something like this, but can’t find a way to write it the proper way

import wixData from 'wix-data';

$w.onReady(function () {

wixData.query("Services")

let Delivery = Delivery.value;

if(Delivery === "true"){
$w("#DeliveryBox").expand();
}
else{
$w("#DeliveryBox").collapse();
}

});

Any help would be very appreciated

Thanks

2

Hi oscar,
are you sure you need to make a query to solve your problem?
maybe save a delivery options object and use this code:

const deliveryOptions={
firstRestaurantName:true,
secondRestaurantName:false
};
//now lets assume the user choose the first restaurant;
const restaurantName=$w("#restaurantNameInput").value;
const Delivery = deliveryOptions[restaurantName];
if(Delivery === true){
$w("#DeliveryBox").expand();
}
else{
$w("#DeliveryBox").collapse();
}

Gal.

3

Thank you for your reply and your time Gal.

Actually, I think I should have describe more in details (I tried to simplify the case so I can understand…), because the reason I want to use a query is that this code goes on a dynamic page. Even that said, I may be wrong…

Let me try to explain.

I have a Collection with 42 restaurants.
I have a Page with a list where user can filter the restaurant by city, and then access to a dynamic page with the elements of that restaurant collected from the database.

Some restaurants have a Delivery service, and other don’t. Then in my collection, some restaurants have the Delivery columns with a checked boolean, and others have the uncheked.

What is the code I need to place on my Restaurant Page, that can access the database and collapse/expand a specific box depending on the boolean setings.

Thats why I thought right to use a query, because I was thinking I had to somehow ask the database if the boolean was checked, and take a action collapse/expand) depending on the result.

That sounds simple to me, I mean, it should not be hard to see if the boolean is checked, and decide to collapse a box, but as I am quite new to code, I just can’t figure how to do.

Speaking about your code, I will give a try right now. The problem is that I have more than 2 restaurants, so with your code :

const deliveryOptions={
firstRestaurantName:true,
secondRestaurantName:false, 
third...
...
forty-thirdRestaurantName:false,
};

This can become hard because the data isn’t dynamic, I have to manually set it true or false for each restaurant…

I hope you read until here, because you’re help is really appreciated

Thank you again

4

Thats ok oscar, i’m happy to help :)),

assuming that you’re using a dynamic page with a dynamic dataset
try to use the following code:

$w("#dynamicDataset").onReady(() => {
let currentRestaurant = $w("#dynamicDataset").getCurrentItem();

if(currentRestaurant.delivery===true){
$w("#DeliveryBox").expand();
$w("#NodeliveryBox").collapse();
}
else{
$w("#DeliveryBox").collapse();
$w("#NodeliveryBox").expand();
}
});

Let me know if that helped you,

Gal.

5

Thats clear to read, I am going to test it right now :slight_smile:

Thanks a lot

6

That’s awesome thanks you so much, it works perfectly as intended now :slight_smile:
I wish you the best, thanks again

And now I even understand how to “ask” the dynamic set for a specific value, so I can replicate the process any time I need it. Great !

7

This is exactly what I needed! Thank you Gal!