Removing document library buttons

Question

In my document library I have successfully hidden the Open In Explorer button by using the following code (code 1).

<script type="text/javascript"> _spBodyOnLoadFunctionNames.push("hideToolbarItem()");    function hideToolbarItem() {   var doc = document.getElementsByTagName('ie:menuitem');      for (var i = 0; i < doc.length; i++)   {     itm = doc[i];          if (itm.id.match('OpenInExplorer')!=null)          {             itm.hidden=true;          }   }  } </script> 

I now need to hide the Connect To Outlook button

I tried to get the code to refer to both menu buttons but that didn't work (code 2)

<script type="text/javascript"> _spBodyOnLoadFunctionNames.push("hideToolbarItem()");    function hideToolbarItem() {   var doc = document.getElementsByTagName('ie:menuitem');      for (var i = 0; i < doc.length; i++)   {     itm = doc[i];          if (itm.id.match('OpenInExplorer')!=null)  if (itm.id.match('OfflineButton')!=null)         {             itm.hidden=true;          }   }  } </script> 

Also using the same code twice doesn't work (code 3)

<script type="text/javascript"> _spBodyOnLoadFunctionNames.push("hideToolbarItem()");    function hideToolbarItem() {   var doc = document.getElementsByTagName('ie:menuitem');      for (var i = 0; i < doc.length; i++)   {     itm = doc[i];          if (itm.id.match('OpenInExplorer')!=null)          {             itm.hidden=true;          }   }  } </script> <script type="text/javascript"> _spBodyOnLoadFunctionNames.push("hideToolbarItem()");    function hideToolbarItem() {   var doc = document.getElementsByTagName('ie:menuitem');      for (var i = 0; i < doc.length; i++)   {     itm = doc[i];          if (itm.id.match('OfflineButton')!=null)          {             itm.hidden=true;          }   }  } </script> 

Both codes 2 and 3 result in Open In Explorer re-appearing and Connect To Outlook dissapearing. I need both gone!I don't know much about Javascript so an explanation of where I'm going wrong would be appreciated :-)

Answer 1

Try using below:

<script type="text/javascript"> 

_spBodyOnLoadFunctionNames.push("hideToolbarItem()");    

function hideToolbarItem() {   
   var doc = document.getElementsByTagName('ie:menuitem');      
   for (var i = 0; i < doc.length; i++)   {     
       itm = doc[i];          
       if (itm.id.match('OpenInExplorer')!=null)  
       {             itm.hidden=true;          }
       if (itm.id.match('OfflineButton')!=null)        
       {             itm.hidden=true;          }   
   }  
}

</script> 

Answer 2

It is always a better approach to use the SharePoint Object Model for this type of thing, as opposed to hiding the physical HTML elements of the ribbon with JavaScript.

Here's a couple links to get you started (the second one specifically speaks to the "Open in Explorer" button):

http://www.learningsharepoint.com/2010/10/24/hide-ribbon-buttons-sharepoint-2010-programmatically/

http://sharepointegg.blogspot.com/2010/02/remove-button-from-ribbon-in-sharepoint.html