I'm trying to add a button to a tab of a ribbon and access some others to add click handlers etc.
ExecuteOrDelayUntilScriptLoaded(function () {
let pm = SP.Ribbon.PageManager.get_instance();
pm.add_ribbonInited(function () {
let ribbon = pm.get_ribbon();
let elementTab = ribbon.getChild('Ribbon.ListItem') as CUI.Tab;
$(elementTab.get_id).one("click", () => {
setTimeout(() => {
let row = elementTab.getChild("Ribbon.ListItem.Manage").getChild("Ribbon.ListItem.Manage-LargeMedium").getChild("Ribbon.ListItem.Manage-LargeMedium-0").getChild("Ribbon.ListItem.Manage-LargeMedium-0-0");
let controlProperties = new CUI.ControlProperties();
let button = new CUI.Controls.Button(ribbon, 'Sample.Button', controlProperties).createComponentForDisplayMode('Large');
row.addChild(button);
}, 100)
});
});
}, 'sp.ribbon.js');
That was the best I could get. The problem is that the tabs are not loaded until they are opened by the user, although I can add new groups to the tab when it's still closed. Please not that these tabs are afaik provided by sharepoint, they are not added by any custom xml file (if that's relevant).
It seems like I'm missing a function "add_tabInited" similar to the function for the ribbon. Or how am I else supposed to know when the group of the tabs are available?
In my code, I tried a workaround by adding a click handler, but it's quite hacky and it requires a reload then to actually see the button.
I would appreciate some help!
