Please provide code sample for creating ScreenMenu via "onscreenready"

[RyanGermann]

I think I'm getting the hang of BB10 / BBUI / WebWorks coding, but resolution to some issues continue to elude me.

On the "ScreenMenu" page, a comment mentions that BB10 UX guidelines indicate that there should be a consistent ScreenMenu for all screens, so generating it from the "onscreenready" event would be wise... I've tried a number of approaches, the most "basic" or obvious of which is to use the id of the "screen" being passed and, after generating the HTML that is the menu and menu-item constructs, use "appendChild" to insert them into the Screen... but that just does not work: the screen doesn't even render in Ripple when I attempt that.

Is there a code sample somewhere that illustrates "the best" method to follow the excellent advice to generate the ScreenMenu (for pages that should have access to the screen menu) consistently and efficiently?

[tneil]

Create a global function to create your menu

function createMenu() {
   var menu = document.createElement('div'), 
        item = document.createElement('div');

   menu.setAttribute('data-bb-type', 'menu');
   menu.appendChild(item);
   item.setAttribute('data-bb-type', 'menu-item');
   item.setAttribute('data-bb-img', 'icon1.png');
   item.innerText = 'My Item';
   item.onclick = function()  {
     alert('you clicked me');
   }

    return menu;
}

The in the onscreenready you insert the menu into the screen.

var config;
config.onscreenready = function(element, id) {
    var screen = element.querySelector('[data-bb-type=screen]');
    screen.appendChild(createMenu());
}

bb.init(config);

[RyanGermann]

Thanks so very much! I was able to use this code almost exactly, except this:

item.onclick = function() { alert('you clicked me'); }

didn't seem to work for me, but using item.setAttribute('onclick',...) did. Maybe I just did something wrong but I now have code that works in Ripple (but the app as a whole is stunted right after the Splash screen on the simulator.)... but for reasons unrelated to this code. Thanks again!