UI Service error: please select active sheet first - user-interface

Question

I'm trying to replicate the code from this page. When I deploy as web app, it brings up the user interface with the input boxes and submit button. However, when I click submit, it brings up this error message: "please select an active sheet first". When I bring up the UI in the spreadsheet itself, I get the same error. Instead of using openById I changed it to getActive.getSheetByName and it worked from the spreadsheet. However, going back to the web app, the new error message is now "Cannot call getSheetByName of null."
Can anyone suggest why I'm getting the "please select an active sheet first" error and what I need to do differently?
Here's the code I've copied, the only change I made was to put my SS key in the two appropriate places.
function doGet(e) {
var doc = SpreadsheetApp.openById("yyyy"); //I've got my SS key here
var app = UiApp.createApplication().setTitle('New app');
// Create a grid with 3 text boxes and corresponding labels
var grid = app.createGrid(3, 2);
grid.setWidget(0, 0, app.createLabel('Name:'));
// Text entered in the text box is passed in to userName
// The setName method will make those widgets available by
// the given name to the server handlers later
grid.setWidget(0, 1, app.createTextBox().setName('userName'));
grid.setWidget(1, 0, app.createLabel('Age:'));
grid.setWidget(1, 1, app.createTextBox().setName('age'));
// Text entered in the text box is passed in to age
grid.setWidget(2, 0, app.createLabel('City'));
grid.setWidget(2, 1, app.createTextBox().setName('city'));
// Text entered in the text box is passed in to city.
// Create a vertical panel..
var panel = app.createVerticalPanel();
// ...and add the grid to the panel
panel.add(grid);
// Create a button and click handler; pass in the grid object as a callback element and the handler as a click handler
// Identify the function b as the server click handler
var button = app.createButton('submit');
var handler = app.createServerHandler('b');
handler.addCallbackElement(grid);
button.addClickHandler(handler);
// Add the button to the panel and the panel to the application, then display the application app
panel.add(button);
app.add(panel);
return app;
}
// Function that records the values in a Spreadsheet
function b(e) {
var doc = SpreadsheetApp.openById("yyyy"); //I've got my SS key here
var lastRow = doc.getLastRow(); // Determine the last row in the Spreadsheet that contains any values
var cell = doc.getRange('a1').offset(lastRow, 0); // determine the next free cell in column A
// You can access e.parameter.userName because you used setName('userName') above and
// also added the grid containing those widgets as a callback element to the server
// handler.
cell.setValue(e.parameter.userName); // Set the value of the cell to userName
cell.offset(0, 1).setValue(e.parameter.age); // Set the value of the adjacent cell to age
cell.offset(0, 2).setValue(e.parameter.city); // set the value of the next cell to city
// Clean up - get the UiInstance object, close it, and return
var app = UiApp.getActiveApplication();
app.close();
// The following line is REQUIRED for the widget to actually close.
return app;
}
Thanks!

Answer 1

You are opening the spreadsheet and should open the sheet in the spreadsheet
sheet = doc.getSheetByName("sheet name")
The documentation