Help passing data from lightbox to page code

Ask the community
,
2

You can defintely pass data back and forth between the lightbox.

See: https://www.wix.com/velo/reference/wix-window/openlightbox

When calling your lightbox you need to pass an object, containing the key/value pairs you are passing into the lightbox.

Eg when calling your lightbox:



  lightboxvalues = {value1: "", value2: "", etc...};  // data being passed to lightbox
  wixWindow.openLightbox("Existing Order Found", lightboxvalues)
    .then( (returnvalues) => {
        // now process the data that came back from the lightbox
        returnvalues.value1  ... etc ( you can return as many items as you want

When you are returning from your lightbox you need to pass the data back to the calling function, as I have shown above where I called it ‘lightboxdata’.

//lightbox code
import wixWindow from 'wix-window';

let dataObject;

$w.onReady(function () {
    // display data passed into lightbox
    dataObject = wixWindow.lightbox.getContext();
    $w("textbox1").text = dataObject.value1;
    $w("textbox2").text = dataObject.value2;
    ... etc
});

// using Save button to exit lightbox and return the data
export function buttonSave_click(event) {
    dataObject.value1 = $w("#inputfield1").value;
    dataObject.value2 = $w("#inputfield2").value;
    wixWindow.lightbox.close(dataObject);
    }

Remember when using the savebutton to exit the lightbox, you have to disable all other exit methods for the lightbox in order to force the user to press the save button.

The api documentation clearly states:
If the lightbox is closed by the site visitor clicking the ‘X’ icon, close button, or lightbox overlay, data will not be passed back the the page that opened the lightbox. Therefore, if you want to make sure data is passed back to the page that opened the lightbox, disable all of the methods mentioned above and create your own method for closing the lightbox programmatically.