private775 icon

JS: Add but button to ribbon in SP2010

private775 | PRO | 09/08/15 07:12:15 PM UTC | 0 ⭐ | 817 👁️ | Never ⏰ | []
JavaScript |

6.31 KB

|

None

|

0 👍

/

0 👎

// Found on:
// http://sharepoint.stackexchange.com/questions/74674/how-can-i-add-a-custom-tab-to-a-ribbon-at-runtime-using-javascript-ecmascript
 
//This example requires JQuery to run because of $.extend()
Type.registerNamespace('Nova.TMRE.Ribbon');
 
//This class is used to help enable controls we create after the ribbon has been built.
Nova.TMRE.Ribbon.CustomChild = function () {
    this.customChildren = [];
};
 
//Note: this method will need modifying to support controls like menus
//this will enable the control all all custom child controls it contains
Nova.TMRE.Ribbon.EnableControl = function (control) {
    if (control) {
        control.set_enabled(true);
        if (control.set_enabledInternal) {
        control.set_enabledInternal(true);
        }
        if (control.customChildren) {
            var length = control.customChildren.length;
            if (length < 1) {
               control.set_enabled(false);
            } else {
                var element = null;
                var tempChildren = [];
                for (var i = 0; i < length; i++) {
                    element = control.customChildren[i];
                    Nova.TMRE.Ribbon.EnableControl(element);
                }
            }
        }
    }
};
 
var buttonAdded = false;
 
function AddButtonToRibbon() {
    if(!buttonAdded){
        buttonAdded = true;
    } else {
        return;
    }
    
    //First we need to make sure the ribbon is initialized
    _ribbonStartInit(_ribbon.initialTabId, false, null);
    //Get the instance of the ribbon
    var ribbon = (SP.Ribbon.PageManager.get_instance()).get_ribbon();
    //Get the initial tab the ribbon loaded, this is the tab we will use.
    // var tab  = ribbon.getChild("Ribbon.DocLibListForm.Edit");
    var tab = ribbon.getChildByTitle("View");
 
    //Get the page manage
    var pageManager = SP.Ribbon.PageManager.get_instance();
 
    //Create a new group for our controls to go into
    var group = new CUI.Group(ribbon, 'Nova.TMRE.Group', 'Priority Payments', 'Priority Payments Controls', 'Nova.TMRE.Group.Command', null);
    //Create a new layout and add it to the group.
    var layout = new CUI.Layout(ribbon, 'Nova.TMRE.Layout', 'Nova.TMRE.Layout');
    group.addChild(layout);
    group.selectLayout(layout.get_title(), layout);
 
    //Create a section
    var  section = new CUI.Section(ribbon, 'Nova.TMRE.Section.Large', 4, 'Top');
    $.extend(section, new Nova.TMRE.Ribbon.CustomChild());
    //Add a section to the layout
    layout.addChild(section);
 
    //Get the row we want to add a button to
    var row1 = section.getRow(1);
    //Define control properties for the button we are about to create
    var controlProperties = new CUI.ControlProperties();
    //Include desired properties.
    //This property is the ID for the command we are giving the button
    controlProperties.Command = 'Nova.TMRE.Button.Command';
    controlProperties.TemplateAlias = 'o1';
    controlProperties.Image32by32 = "/_layouts/images/SharePointDesigner32.png";
    controlProperties.ToolTipTitle = "Test 02";
    controlProperties.LabelText = "Reject Payment";
    //Create a new Button
    var fooButton = new CUI.Controls.Button(ribbon, 'Nova.TMRE.Button', controlProperties);
    //Create a control component for the button
    var controlComponent = new CUI.ControlComponent(ribbon, 'Nova.TMRE.MenuItem.Button', 'Large', fooButton);
    //Link the control component back to the button, this looks weird but is necessary.
    //The use of the variable $2J_1 is very bad this changes between SharePoint versions
    fooButton.$2J_1 = fooButton.get_id();
    fooButton.get_components().push(controlComponent);
    //Make sure the button is part of our custom class, this is important for making sure     the button stays enabled
    section.customChildren.push(fooButton);
    //Add the control component(and button) to the row
    row1.addChild(controlComponent);
    //Add the group to our tab once we have created and attached all the controls
    tab.addChild(group);
    //This is sort of hacky, but a custom command needs to be created to enable all the     custom controls When RefreshCommandUI() is called
    var cmd = new Object();
    cmd.handleCommand = function (commandId, properties, sequenceNumber) {
            var length = section.customChildren.length;
            if (length > 0) {
                var element = null;
                for (var i = 0; i < length; i++) {
                    element = section.customChildren[i];
                    if (element) {
                        Nova.TMRE.Ribbon.EnableControl(element);
                    }
                }
            }
    };
    //Get the dispatcher
    var dispatcher = pageManager.get_commandDispatcher();   
    //Register our refresh command with the dispatched
    dispatcher.registerCommandHandler(Commands.CommandIds.ApplicationStateChanged, cmd);
 
    //Create a click command for our button
    var buttonCmd = new Object();
    //This specifies that the button has a command and can be clicked
    buttonCmd.canHandleCommand = function (commandId) {
        return true;
    };
    //The command that is executed when the button is clicked
    buttonCmd.handleCommand = function (commandId, properties, sequenceNumber) {
        alert("Button Clicked");
    };
    //'Nova.TMRE.Button.Command' is the CommandID and must match the controlProperties.Command
    dispatcher.registerCommandHandler('Nova.TMRE.Button.Command', buttonCmd);
    //Refresh the UI so our control(s) are enabled
    RefreshCommandUI();
}
 
function parseHierarchyTT(current, level){
    //debugger;
    var iid = current.get_id();
    
    if(typeof current.get_title === "function") {
        var title = current.get_title();
    }
    if(typeof current.get_componentElement === "function") {
        var componentElement = current.get_componentElement();
    }
    if(current !== null && typeof current.$4_0 !== "undefined" && current.$4_0 !== null && typeof current.$4_0.getEnumerator === "function"){
        var enm=current.$4_0.getEnumerator();
        while(enm.moveNext()){
            var chld = enm.get_current();
            var chldLevel = level + 1;
            parseHierarchyTT(chld, chldLevel);
        }
    }
}
 
// Note: 'SOD' is an abbreviation for "Script on Demand"
SP.SOD.executeOrDelayUntilScriptLoaded(function() {
    var pm = SP.Ribbon.PageManager.get_instance();
 
    pm.add_ribbonInited(function() {
    AddButtonToRibbon();
    });
 
    var ribbon = null;
    try
    {
    ribbon = pm.get_ribbon();
    }
    catch (e) { }
 
    if (!ribbon) {
    if (typeof(_ribbonStartInit) == "function")
       _ribbonStartInit(_ribbon.initialTabId, false, null);
    }
    else {
    AddButtonToRibbon();
    }
}, "sp.ribbon.js");

Comments