google script unable to update web page

Question

Below is snippet where I create a web page / app and show a list. Then on click of item in list I want to replace the list with another list. I try it by using vertical panel as root container and clearing and adding list to it. The web page though keeps showing old list even after handler for new list executes fine.

//user_list function updates vertical panel but the web page still shows old rep_list
 function doGet(e) {
   if(e == null || e.parameter.dvid == null) {
     return rep_list();
   }  
 }

function user_list(path) {

  var app = UiApp.getActiveApplication().setTitle("List Folders");

  var content = app.getElementById('root');

  content.clear();
  var list = app.createListBox();
  //populate list  

  content.add(list);
  return app;

}

function rep_list () {

  var app = UiApp.createApplication().setTitle("List Repositories");

  var content = app.createVerticalPanel().setId('root');
  var list = app.createListBox(true).setId('repoList').setName('repo');
  var handler = app.createServerHandler("listFolders");
  list.addClickHandler(handler)

  //populate list

  content.add(list);

  app.add(content);
  return app;

}

function listFolders(e){
  var repo = e.parameter.repo;
  user_list(repo);
}

Regards,

Miten.

Answer 1

Your listFolders() function isn't returning a new UI instance. Try:

function listFolders(e){
  var repo = e.parameter.repo;
  var app = user_list(repo);
  return app;
}