Supporters of End User
Web

Hiding the New Toolbar Button in SharePoint with jQuery

 
Item is currently unrated. Press SHIFT+ENTER to rate this item.1 star selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+ESCAPE to leave rating submit mode.2 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.3 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.4 stars selected. Press SHIFT+ENTER to submit. Press TAB to increase rating. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.5 stars selected. Press SHIFT+ENTER to submit. Press SHIFT+TAB to decrease rating. Press SHIFT+ESCAPE to leave rating submit mode.
Categories: 

Bil SimserGuest Author: Bil Simser
Fear and Loathing

Another quick little fun thing today. Many times you might want (need) to hide the �New" button on a list toolbar. You know the one I mean?

Hiding the New Toolbar Button

Why would you want to do such a thing? For example on a project I�m building I actually call the NewForm.aspx page with a querystring because I want to pre-populate my form with some vales. As such, I don�t want users to create new items in a list without these references and since they have to come from another list I�m left with the problem of trying to restrict them from creating new items but still offer them the ability to use the features of the list like alerts, exporting to spreadsheets, etc. Yes, the �New� button isn�t available for readers of a list but for contributors it is and for admins you can�t just turn some of this stuff off easily.

Comments

Jeff Langdon

Hiding the New Toolbar Button in SharePoint with jQuery

My approach was similar, big fan of jQuery for SharePoint. My code hides the Delete Item button in the SharePoint:Toolbar on a DispForm.

$(document).ready(function() {
$("td.ms-titlearea").hide();
$("a[title='Delete Item']").parent().parent().parent().hide();

});

Posted 16-Nov-2009 by Jeff Langdon
Jeff Langdon

Hiding the New Toolbar Button in SharePoint with jQuery

Oops. Actually the second line hides the breadcrumb navigation, the third hides the button and I forgot to paste in the fourth which hides the separator bar. Sorry for any confusion.

$(document).ready(function() {
$("td.ms-titlearea").hide();
$("a[title='Delete Item']").parent().parent().parent().hide();
$("td.ms-separator:nth-child(4)").hide();
});

Posted 16-Nov-2009 by Jeff Langdon
Caleb

Hiding the New Toolbar Button in SharePoint with jQuery

Another solution to this problem is to open the AllItems page in SP Designer and convert the list web part into an XSLT Data View. You can then select the New button and delete it while keeping everything else the same as the original list view web part (Actions and Settings buttons are still there). Save the page as AllItems2 and change the list properties to use it as the default AllItems page.

Posted 16-Nov-2009 by Caleb
Kermit

Hiding the New Toolbar Button in SharePoint with jQuery

How would you hide a button in the middle of the Full Toolbar? Say the "Actions". Thanks

Posted 24-Nov-2009 by Kermit
Jeff Langdon

Hiding the New Toolbar Button in SharePoint with jQuery

The easiest way to discover which DOM objects you need to select and subsequently hide is with a Firefox plug-in called Firebug - http://getfirebug.com/

I was able to hide the "Actions" button and the vertical bar next to the button with the following. You mileage may vary.



$(document).ready(function() {
$("#zz23_ListActionsMenu_t").hide();
$("td.ms-separator:nth-child(2)").hide();
});

Good luck,

Jeff Langdon
Mathematica Policy Research
SharePoint Admin/Programmer

Twitter: @jlangdon

Posted 24-Nov-2009 by Jeff Langdon
Bil Simser

Hiding the New Toolbar Button in SharePoint with jQuery

@Jeff: Nice example. One thing to be cautious of is the IDs that SharePoint uses. They're all generated and generally when you see something like "zz23_xxx" as an ID, it's actually using the ordinal position in say a navigation place. So hiding the "Actions" menu by looking for "zz23_xxx" might work on one system but someone else who might have a different configuration that actions menu may be "zz21_xxx". Just something to keep in the back of your mind. IDs are not guaranteed to be the same from system to system.

Posted 29-Nov-2009 by Bil Simser
Ron

Hiding the New Toolbar Button in SharePoint with jQuery

@Jeff:
Thats what i was looking for to hide item in dispfrm Toolbar.
can you please tell me how can hide both workflows and Manage copies.

Thanks
Ron

Posted 08-Dec-2009 by Ron
Ron

Hiding the New Toolbar Button in SharePoint with jQuery

@Jeff: i got it thanks for Tips

Posted 08-Dec-2009 by Ron
Bryan

Hiding the New Toolbar Button in SharePoint with jQuery

@Kermit

hidding JUST the action button can be done as follows:



$(document).ready(function(){
$('.ms-menutoolbar td:eq(5)').hide();
$('.ms-menutoolbar td:eq(6)').hide();
});


td 5 is the seperator between upload and action
td 6 is the action cell

for those that don't know :eq matches a single element by its index
http://docs.jquery.com/Selectors/eq#index

Posted 21-Dec-2009 by Bryan
EndUserSharePoint

Hiding the New Toolbar Button in SharePoint with jQuery

Bryan - Thanks for the explanation on ":eq". That should help open a few other techniques to people trying to manage the interface through CEWPs.

Posted 22-Dec-2009 by EndUserSharePoint
Avinash.Devkate

Hiding the New Toolbar Button in SharePoint with jQuery

Use the following code. First download 1.2.6.min.js library and put it in the 12/Layouts root. Then copy paste following code in to CE webpart. Done.If you want to hide all, replace lt(1) by lt(3).
 
    $(document).ready(function(){ 
        $('.ms-menutoolbar td:lt(1)').hide(); 
    }); 
--Avinash.Devkate---

Posted 30-Dec-2009 by Avinash.Devkate
Jim Bob Howard

Hiding the New Toolbar Button in SharePoint with jQuery

Looks like we're missing some formatting on this one....

Posted 13-Jan-2010 by Jim Bob Howard
EndUserSharePoint

Hiding the New Toolbar Button in SharePoint with jQuery

Should be good to go, now.

Posted 13-Jan-2010 by EndUserSharePoint
Francis Waldron

Hiding the New Toolbar Button in SharePoint with jQuery

Hi, Great post!
How would you hide or rename one of the options under the settings action item?
Thanks Frank

Posted 12-Feb-2010 by Francis Waldron
rachel xu

Hiding the New Toolbar Button in SharePoint with jQuery

it doesn't work for me. Do I need to install anything before dropping the CEWP to the page?

Posted 17-Feb-2010 by rachel xu
rachel xu

Hiding the New Toolbar Button in SharePoint with jQuery

I was able to get Bil's code working, but when i want to hide the Delete button on DispForm and EditForm using Jeff Langdon's code, it doesn't do anything.

Posted 18-Feb-2010 by rachel xu
Sasha

Hiding the New Toolbar Button in SharePoint with jQuery

I would like to add a custom link to the DispForm.aspx and dont know where to start. Any help would be appreciated. Thanks.

Posted 19-Mar-2010 by Sasha
EndUserSharePoint

Hiding the New Toolbar Button in SharePoint with jQuery

Post on Stump the Panel, and you'll probably get a quicker response. -- Mark

Posted 19-Mar-2010 by EndUserSharePoint
cole

Hiding the New Toolbar Button in SharePoint with jQuery

I have tried using this example since I need to hide Actions button
This is not working for me
Do I need to do more than just to wrap this into tags inside of CEWP?

Posted 14-Sep-2010 by cole
venkat

hiding " add new item" based on list items count

I am using SharePoint 2010. I have list A and list B in two webparts, I have connected both webparts using webpart connections. So when I select the connection link in list A it filters the items in List B baesd on ID. Now I want to customize list B to restrict end user to add only one item for one ID of list A. i.e., List A - List B AID001 - BID001 AID002 - BID002 At the moment I can add one or more items in List B for list A i.e., AID001 - BID001, BID002, BID003 ... So I should be restricted to add only 1 item in list B associated to list A item , once the user add one item in List B then the " Add new item " should disappear. Thanks

Posted 23-Jan-2012 by venkat

Notify me of comments to this article

E-mail:
   

Add Comment

Title:

 
Comment:
Email:

   


Name:

 
Url: