Dropdown List to Open Correct Lightbox HELP!

Ask the community
,
1

Hi guys,

I have a question regarding a Dropdown List and Lightboxes.

I have a dropdown list of 3 items and a button to proceed. When the user choose 1 item in the list and presses the button, a correlating lightbox will open.

I found a code that potentially help me to do it, but I am not familiar with Wix Corvid syntax.

I’m also confused about the database. If Wix let me pull the data from the database and link it to a lightbox, that’d be so much easier. Apparently there is no option for that.

I have a data base of 2 columns: One for items name, and one is lightbox number (or sorting purposes).

Here’s the code I found:

import wixData from 'wix-data';

import wixWindow from 'wix-window';

// This part loads the Variety Lightboxes

export function dropdown1_change(event) {

	//Open Lightbox Variety 1: 

if ($w('#dropdown1').value === "Variety 1")

    (wixWindow.openLightbox("Variety 1")

    )

    //Open Lightbox Variety 2:

if ($w('#dropdown1').value === "Variety 2")

    (wixWindow.openLightbox("Variety 2")

    )

    //Open Lightbox Variety 3:

if ($w('#dropdown1').value === "Variety 3")

    (wixWindow.openLightbox("Variety 3")

)}

Do I need to add a function onClick for the button?

I need your help.

2

Hello Eric,

try this one… (tested and it works!).

You will need:
----------------------------------
1) 1x Dropdown (ID = “dropdown1” )
Values in dropdown1 —> “Lightbox1, Lightbox2, Lightbox3”
2) 2x or 3x Lightboxes called → “MyLightbox1”, “MyLightbox2”, “MyLightbox3”
(ID of lightboxes can be —> lightbox1, lightbox2, lightbox3.
3) This CODE.

import wixData from 'wix-data';
import wixWindow from 'wix-window';

$w.onReady(function () {
    $w('#dropdown1').onChange(()=>{
 if ($w('#dropdown1').value === "Lightbox1")
    (wixWindow.openLightbox("MyLightbox1")
    )
 
if ($w('#dropdown1').value === "Lightbox2")
    (wixWindow.openLightbox("MyLightbox2")
    )
 
if ($w('#dropdown1').value === "Lightbox3"")
    (wixWindow.openLightbox("MyLightbox3")
)
    })
});

Good luck and happy coding!

Or here a little better version…with an example…

https://russian-dima.wixsite.com/meinewebsite/call-a-lightbox

267×540 11.5 KB

import wixData from 'wix-data';
import wixWindow from 'wix-window';

$w.onReady(function () {
    $w('#dropdown1').onChange(()=>{
 if ( $w('#dropdown1').value === "MyBox1") {wixWindow.openLightbox("MyLightbox1")}
 if ( $w('#dropdown1').value === "MyBox2") {wixWindow.openLightbox("MyLightbox2")}
 if ( $w('#dropdown1').value === "MyBox3") {wixWindow.openLightbox("MyLightbox3")}
    })
});