Google Script Get UI textbox value - textbox

Question

I have created a simple GUI with 2 textboxes and 1 button. The button handler goes as below
function handleButton1(e)
{
var app = UiApp.getActiveApplication();
var v1 = e.parameter.TextBox1;
var v2 = e.parameter.TextBox2;
Logger.log(v1);
app.getElementById("TextBox1").setText(v2);
app.getElementById("TextBox2").setText(v1);
return app;
}
When I run the app the textbox values are TextBox1 and TextBox2.
When press button then both the textbox value displayed is undefined.
Where am I going wrong.

Answer 1

With a server-side click handler, you need to explicitly include values in the handler event by using .addCallbackElement(). If you do so, the current value of the named elements you add will be included in the event delivered to your handler.
Since you are seeing undefined, it's likely that you didn't add the callbacks. You should have something like this in your UI definition:
var handler = app.createServerHandler('handleButton1')
.addCallbackElement(textBox1)
.addCallbackElement(textBox2);
button.addClickHandler(handler);
The name of the element will be used to label the callback value (.setName()), while the id will be used to access the element in your handler (.setId()).
Here's a working version of your script:
function doGet() {
var app = UiApp.createApplication();
var textBox1 = app.createTextBox().setName("TextBox1").setId("TextBox1");
var textBox2 = app.createTextBox().setName("TextBox2").setId("TextBox2");
var button = app.createButton('Swap Contents');
app.add(textBox1).add(textBox2).add(button);
var handler = app.createServerHandler('handleButton1')
.addCallbackElement(textBox1)
.addCallbackElement(textBox2);
button.addClickHandler(handler);
return app;
}
function handleButton1(e)
{
//Logger.log(JSON.stringify(e));
var app = UiApp.getActiveApplication();
var v1 = e.parameter.TextBox1;
var v2 = e.parameter.TextBox2;
app.getElementById("TextBox1").setText(v2);
app.getElementById("TextBox2").setText(v1);
return app;
}