Formulario de Contacto por UI

Para armar un formulario de contacto, vamos a utilizar la opción de publicar un script como servicio.

Cuando publicamos un script como servicio obtenemos una dirección (url) a través de la cual vamos a poder ver la pantalla que armamos.

La función que se ejecuta al acceder a esa dirección es doGet(). Allí vamos a poner todo el código que arma la pantalla con los elementos que queremos.

function doGet(){

var app = UiApp.createApplication().setTitle('Contacto');

var grid = app.createGrid(3, 2);

grid.setWidth("40em");

grid.setWidget(0, 0, app.createLabel('Nombre:'));

grid.setWidget(0, 1, app.createTextBox().setName('userName').setId('userName').setWidth("100%"));

grid.setWidget(1, 0, app.createLabel('Email:'));

grid.setWidget(1, 1, app.createTextBox().setName('userMail').setId('userMail').setWidth("100%"));

grid.setWidget(2, 0, app.createLabel('Mensaje'));

grid.setWidget(2, 1, app.createTextArea().setName('userMsg').setId('userMsg').setVisibleLines(10).setWidth("100%"));

// Create a vertical panel and add the grid to the panel

var panel = app.createVerticalPanel();

panel.add(grid);

var buttonPanel = app.createHorizontalPanel();

var button = app.createButton('submit');

var submitHandler = app.createServerClickHandler('submit');

submitHandler.addCallbackElement(grid);

button.addClickHandler(submitHandler);

buttonPanel.add(button);

// For the close button, we create a server click handler closeHandler and pass closeHandler to the close button as a click handler.

// The function close is called when the close button is clicked.

var closeButton = app.createButton('close');

var closeHandler = app.createServerClickHandler('close');

closeButton.addClickHandler(closeHandler);

buttonPanel.add(closeButton);

// Create label called statusLabel and make it invisible; add buttonPanel and statusLabel to the main display panel.

var statusLabel = app.createLabel().setId('status').setVisible(false);

panel.add(statusLabel);

panel.add(buttonPanel);

app.add(panel);

return app;

}

// Close everything return when the close button is clicked

function close() {

var app = UiApp.getActiveApplication();

app.close();

// The following line is REQUIRED for the widget to actually close.

return app;

}

// function called when submit button is clicked

function submit(e) {

var app = UiApp.getActiveApplication();

//envio el mail

MailApp.sendEmail("celeste.tor@gmail.com", e.parameter.userMail, "Nuevo Mensaje de Basket", e.parameter.userName + ' dice: ' + e.parameter.userMsg )

//limpio la pantalla

app.getElementById('userName').setValue('');

app.getElementById('userMail').setValue('');

app.getElementById('userMsg').setValue('');

// Make the status line visible and tell the user the possible actions

app.getElementById('status').setVisible(true).setText('Su mensaje ha sido enviado!, le responderemos a la brevedad.');

return app;

}​