popup - showsidebar - Ventana emergente simple o cuadro de diálogo en Google Apps Script

msgbox google script

Question

Estoy buscando un código simple que agregue una ventana emergente en mi Google Apps Script Ui que aparece cuando presiono un botón de enviar. El cuadro emergente mostraría un mensaje y un botón para cerrar la ventana emergente.

He buscado por todos lados, todo parece muy complicado y hace mucho más de lo que necesito.

Este es el código actual que tengo para el botón de enviar.

 function doGet() {
var app = UiApp.createApplication();
app.setTitle("My Logbook");
var hPanel_01 = app.createHorizontalPanel();
var vPanel_01 = app.createVerticalPanel();
var vPanel_02 = app.createVerticalPanel();
var vPanel_03 = app.createVerticalPanel();
var submitButton = app.createButton("Submit");
//Create click handler
var clickHandler = app.createServerHandler("submitData");
submitButton.addClickHandler(clickHandler);
clickHandler.addCallbackElement(hPanel_01);
////Test PopUp Panel
var app = UiApp.getActiveApplication();
var app = UiApp.createApplication;
var dialog = app.createDialogBox();
var closeHandler = app.createClientHandler().forTargets(dialog).setVisible(false);
submitButton.addClickHandler(closeHandler);
var button= app.createButton(''Close'').addClickHandler(closeHandler);
dialog.add(button);
app.add(dialog);
//////
return app;
}

Answer 1

¿Has probado usar zIndex? Coloca el panel sobre todos sus otros paneles ...

var popupPanel = app.createVerticalPanel().setId(''popupPanel'')
.setVisible(false)
.setStyleAttribute(''left'', x)
.setStyleAttribute(''top'', y)
.setStyleAttribute(''zIndex'', ''1'')
.setStyleAttribute(''position'', ''fixed'');

x = posición del panel desde la parte izquierda de su aplicación y = posición del panel desde la parte superior de su aplicación zIndex = la ''capa'' en la que aparecerá su panel. Puede apilar paneles usando ''1'', ''2'', ''3'', etc. posición = su panel estará en una posición fija denotada por (x, y)

La visibilidad se establece en falso hasta que haga clic en enviar, luego tenga un controlador de cliente para su botón de envío que haga visible el panel emergente. Cuando hace clic en el botón en su popupPanel, haga que el controlador del cliente establezca la visibilidad a falso una vez más y desaparecerá.

Una cosa más, noté que obtuviste la aplicación activa y luego creas una nueva aplicación. No necesita crear una nueva aplicación ... solo paneles nuevos dentro de su aplicación.

¡Espero que esto ayude!

Answer 2

Como UiApp está depreciado, HTMLService se debe usar para crear interfaces de usuario personalizadas.

Para solicitar una ventana emergente simple para mostrar un mensaje, use el método de alert de la clase Ui

var ui = DocumentApp.getUi();
ui.alert(''Hello world'');

mostrará una ventana emergente simple con hello world y un botón ok.

Para mostrar una plantilla html personalizada en Diálogo, use HTMLService para crear una plantilla y luego páselo al método showModalDialog de la Clase Ui.

var html = HtmlService.createHtmlOutput("<div>Hello world</div>").setSandboxMode(HtmlService.SandboxMode.IFRAME);
DocumentApp.getUi().showModalDialog(html, "My Dialog");

HtmlService.createHtmlOutputFromFile permite mostrar html que está en un archivo separado. ver la documentación

Answer 3

Popup: usa algo como esto:

 var table = app.createFlexTable();
table.setStyleAttribute("position", "absolute");
table.setStyleAttribute("background", "white"); 

agregue artículos a la mesa y escóndalos y muéstrelos según sea necesario.

Answer 4

Puede usar un cuadro de diálogo para emergente. Agregue un botón al cuadro de diálogo. Agregue un controlador de cliente que establece el cuadro de diálogo invisible, una vez que haga clic en el botón.

var app = UiApp.createApplication;
var dialog = app.createDialogBox();
var closeHandler = app.createClientHandler().forTargets(dialog).setVisible(false);
var button= app.createButton(''Close'').addClickHandler(closeHandler);
dialog.add(button);
app.add(dialog);

Esto debería ayudar.

EDITAR

Se agregó "()" después de .createClientHandler. Eso debería eliminar problemas relacionados con TypeError: No se puede encontrar la función createDialogBox en la función object createApplication () {/ * * /}