Advertisement
private775

JS: Add but button to ribbon in SP2010

Sep 8th, 2015
396
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // Found on:
  2. // http://sharepoint.stackexchange.com/questions/74674/how-can-i-add-a-custom-tab-to-a-ribbon-at-runtime-using-javascript-ecmascript
  3.  
  4. //This example requires JQuery to run because of $.extend()
  5. Type.registerNamespace('Nova.TMRE.Ribbon');
  6.  
  7. //This class is used to help enable controls we create after the ribbon has been built.
  8. Nova.TMRE.Ribbon.CustomChild = function () {
  9.     this.customChildren = [];
  10. };
  11.  
  12. //Note: this method will need modifying to support controls like menus
  13. //this will enable the control all all custom child controls it contains
  14. Nova.TMRE.Ribbon.EnableControl = function (control) {
  15.     if (control) {
  16.         control.set_enabled(true);
  17.         if (control.set_enabledInternal) {
  18.         control.set_enabledInternal(true);
  19.         }
  20.         if (control.customChildren) {
  21.             var length = control.customChildren.length;
  22.             if (length < 1) {
  23.                control.set_enabled(false);
  24.             } else {
  25.                 var element = null;
  26.                 var tempChildren = [];
  27.                 for (var i = 0; i < length; i++) {
  28.                     element = control.customChildren[i];
  29.                     Nova.TMRE.Ribbon.EnableControl(element);
  30.                 }
  31.             }
  32.         }
  33.     }
  34. };
  35.  
  36. var buttonAdded = false;
  37.  
  38. function AddButtonToRibbon() {
  39.     if(!buttonAdded){
  40.         buttonAdded = true;
  41.     } else {
  42.         return;
  43.     }
  44.    
  45.     //First we need to make sure the ribbon is initialized
  46.     _ribbonStartInit(_ribbon.initialTabId, false, null);
  47.     //Get the instance of the ribbon
  48.     var ribbon = (SP.Ribbon.PageManager.get_instance()).get_ribbon();
  49.     //Get the initial tab the ribbon loaded, this is the tab we will use.
  50.     // var tab  = ribbon.getChild("Ribbon.DocLibListForm.Edit");
  51.     var tab = ribbon.getChildByTitle("View");
  52.  
  53.     //Get the page manage
  54.     var pageManager = SP.Ribbon.PageManager.get_instance();
  55.  
  56.     //Create a new group for our controls to go into
  57.     var group = new CUI.Group(ribbon, 'Nova.TMRE.Group', 'Priority Payments', 'Priority Payments Controls', 'Nova.TMRE.Group.Command', null);
  58.     //Create a new layout and add it to the group.
  59.     var layout = new CUI.Layout(ribbon, 'Nova.TMRE.Layout', 'Nova.TMRE.Layout');
  60.     group.addChild(layout);
  61.     group.selectLayout(layout.get_title(), layout);
  62.  
  63.     //Create a section
  64.     var  section = new CUI.Section(ribbon, 'Nova.TMRE.Section.Large', 4, 'Top');
  65.     $.extend(section, new Nova.TMRE.Ribbon.CustomChild());
  66.     //Add a section to the layout
  67.     layout.addChild(section);
  68.  
  69.     //Get the row we want to add a button to
  70.     var row1 = section.getRow(1);
  71.     //Define control properties for the button we are about to create
  72.     var controlProperties = new CUI.ControlProperties();
  73.     //Include desired properties.
  74.     //This property is the ID for the command we are giving the button
  75.     controlProperties.Command = 'Nova.TMRE.Button.Command';
  76.     controlProperties.TemplateAlias = 'o1';
  77.     controlProperties.Image32by32 = "/_layouts/images/SharePointDesigner32.png";
  78.     controlProperties.ToolTipTitle = "Test 02";
  79.     controlProperties.LabelText = "Reject Payment";
  80.     //Create a new Button
  81.     var fooButton = new CUI.Controls.Button(ribbon, 'Nova.TMRE.Button', controlProperties);
  82.     //Create a control component for the button
  83.     var controlComponent = new CUI.ControlComponent(ribbon, 'Nova.TMRE.MenuItem.Button', 'Large', fooButton);
  84.     //Link the control component back to the button, this looks weird but is necessary.
  85.     //The use of the variable $2J_1 is very bad this changes between SharePoint versions
  86.     fooButton.$2J_1 = fooButton.get_id();
  87.     fooButton.get_components().push(controlComponent);
  88.     //Make sure the button is part of our custom class, this is important for making sure     the button stays enabled
  89.     section.customChildren.push(fooButton);
  90.     //Add the control component(and button) to the row
  91.     row1.addChild(controlComponent);
  92.     //Add the group to our tab once we have created and attached all the controls
  93.     tab.addChild(group);
  94.     //This is sort of hacky, but a custom command needs to be created to enable all the     custom controls When RefreshCommandUI() is called
  95.     var cmd = new Object();
  96.     cmd.handleCommand = function (commandId, properties, sequenceNumber) {
  97.             var length = section.customChildren.length;
  98.             if (length > 0) {
  99.                 var element = null;
  100.                 for (var i = 0; i < length; i++) {
  101.                     element = section.customChildren[i];
  102.                     if (element) {
  103.                         Nova.TMRE.Ribbon.EnableControl(element);
  104.                     }
  105.                 }
  106.             }
  107.     };
  108.     //Get the dispatcher
  109.     var dispatcher = pageManager.get_commandDispatcher();  
  110.     //Register our refresh command with the dispatched
  111.     dispatcher.registerCommandHandler(Commands.CommandIds.ApplicationStateChanged, cmd);
  112.  
  113.     //Create a click command for our button
  114.     var buttonCmd = new Object();
  115.     //This specifies that the button has a command and can be clicked
  116.     buttonCmd.canHandleCommand = function (commandId) {
  117.         return true;
  118.     };
  119.     //The command that is executed when the button is clicked
  120.     buttonCmd.handleCommand = function (commandId, properties, sequenceNumber) {
  121.         alert("Button Clicked");
  122.     };
  123.     //'Nova.TMRE.Button.Command' is the CommandID and must match the controlProperties.Command
  124.     dispatcher.registerCommandHandler('Nova.TMRE.Button.Command', buttonCmd);
  125.     //Refresh the UI so our control(s) are enabled
  126.     RefreshCommandUI();
  127. }
  128.  
  129. function parseHierarchyTT(current, level){
  130.     //debugger;
  131.     var iid = current.get_id();
  132.    
  133.     if(typeof current.get_title === "function") {
  134.         var title = current.get_title();
  135.     }
  136.     if(typeof current.get_componentElement === "function") {
  137.         var componentElement = current.get_componentElement();
  138.     }
  139.     if(current !== null && typeof current.$4_0 !== "undefined" && current.$4_0 !== null && typeof current.$4_0.getEnumerator === "function"){
  140.         var enm=current.$4_0.getEnumerator();
  141.         while(enm.moveNext()){
  142.             var chld = enm.get_current();
  143.             var chldLevel = level + 1;
  144.             parseHierarchyTT(chld, chldLevel);
  145.         }
  146.     }
  147. }
  148.  
  149. // Note: 'SOD' is an abbreviation for "Script on Demand"
  150. SP.SOD.executeOrDelayUntilScriptLoaded(function() {
  151.     var pm = SP.Ribbon.PageManager.get_instance();
  152.  
  153.     pm.add_ribbonInited(function() {
  154.     AddButtonToRibbon();
  155.     });
  156.  
  157.     var ribbon = null;
  158.     try
  159.     {
  160.     ribbon = pm.get_ribbon();
  161.     }
  162.     catch (e) { }
  163.  
  164.     if (!ribbon) {
  165.     if (typeof(_ribbonStartInit) == "function")
  166.        _ribbonStartInit(_ribbon.initialTabId, false, null);
  167.     }
  168.     else {
  169.     AddButtonToRibbon();
  170.     }
  171. }, "sp.ribbon.js");
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement