Search.../

close( )

Closes the lightbox.

Description

The close() function closes the lightbox and returns the given data to the openLightbox() function that was used to open the lightbox.

To pass data back to the page that opened the lightbox, you must close the lightbox programmatically using the close() function. 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. For example, you can add a button with an onClick event handler that calls the close() function.

Syntax

function close([data: Object]): void

close Parameters

NAME
TYPE
DESCRIPTION
data
Optional
Object

The data to pass back to openLightbox() function.

Returns

This function does not return anything.

Return Type:

void

Was this helpful?

Close the lightbox

Copy Code
1import wixWindow from 'wix-window';
2
3// ...
4
5wixWindow.lightbox.close();
Close the lightbox and pass back data to the opening function

Copy Code
1import wixWindow from 'wix-window';
2
3// ...
4
5wixWindow.lightbox.close(dataObj);
A scenario where information is passed between a page and a lightbox

This example demonstrates how to pass data from a page to a lightbox that it opens and from the lightbox back to the page as it closes.

It assumes that the page has:

  • An open button that is used to open the lightbox.
  • Two text inputs where information that is to be passed to the lightbox is entered.
  • Two text elements where information that is passed from the lightbox is displayed.

It assumes that the lightbox has:

  • A close button that is used to close the lightbox.
  • Two text inputs where information that is to be passed to the page is entered.
  • Two text elements where information that is passed from the page is displayed.

Copy Code
1/*************
2 * Page Code *
3 *************/
4
5import wixWindow from 'wix-window';
6
7export function openButton_click(event) {
8 wixWindow.openLightbox("MyLightBox", {
9 "pageSend1": $w('#pageSend1').value,
10 "pageSend2": $w('#pageSend2').value
11 })
12 .then( (data) => {
13 $w('#pageReceive1').text = data.lightBoxSend1;
14 $w('#pageReceive2').text = data.lightBoxSend2;
15 } );
16}
17
18/*****************
19 * Lightbox Code *
20 *****************/
21
22import wixWindow from 'wix-window';
23
24$w.onReady( function () {
25 let received = wixWindow.lightbox.getContext();
26 $w('#lightBoxReceive1').text = received.pageSend1;
27 $w('#lightBoxReceive2').text = received.pageSend2;
28} );
29
30export function closeButton_click(event) {
31 wixWindow.lightbox.close( {
32 "lightBoxSend1": $w('#lightBoxSend1').value,
33 "lightBoxSend2": $w('#lightBoxSend2').value
34 } );
35}
36