Home > Blogs > Eric Shupps | The SharePoint Cowboy > Posts > Hiding Toolbars in the SharePoint 2010 Chart Web Part
 
Eric Shupps eshupps The SharePoint Cowboy is the founder and President of BinaryWave, a leading provider of operational intelligence solutions for Microsoft SharePoint. Eric Shupps eshupps The SharePoint Cowboy has worked with SharePoint Products and Technologies since 2001 as a consultant, administrator, architect, developer and trainer. he is an advisory committee member of the Dallas/Ft. Worth SharePoint Community group and participating member of user groups throughout the United Kingdom. Eric Shupps eshupps The SharePoint Cowboy has authored numerous articles on SharePoint, speaks at user group meetings and conferences around the world, and publishes a popular SharePoint blog at http://www.sharepointcowboy.com. Presentations by Eric Shupps eshupps The SharePoint Cowboy Webinar - Migrating Legacy On Premise Solutions to SharePoint Online and Windows Azure featuring Eric Shupps Who are you and what do you want - Working with OAuth in SharePoint 2013 SharePoint is Talking Are You Listening? Eric Shupps SharePoint 2013 Performance Enhancements Taking Advantage of the SharePoint 2013 REST API Eric Shupps on Improving Performance with New Features in SharePoint 2013 SharePoint 2013 New and Improved Migrating Legacy On Premise Solutions to SharePoint Online and Windows Azure Eric Shupps Presents SharePoint 2013 Real World Help Desk App End to End Windows Azure Apps for SharePoint 2013 Eric Shupps Demonstrates Customizing the Visual Studio 2010 SharePoint Deployment Process Introduction to SharePoint Development SharePoint 2010 Unit and Integration Testing with Eric Shupps Building Enterprise Records Management Solutions for SharePoint 2010 Taming Information Chaos in SharePoint 2010 SharePoint 2010 Performance and Capacity Planning Best Practices Building Dynamic Applications with the SharePoint Client Object Model Articles by Eric Shupps eshupps The SharePoint Cowboy Eric Shupps' Ten Steps to Optimize SharePoint Performance Webcasts by Eric Shupps eshupps The SharePoint Cowboy Secrets of SharePoint Part 5: Configuring Microsoft Office SharePoint Server 2007 for Optimal Performance Creating End User SharePoint Solutions for Performance and Scalability SharePoint 2010 Performance Enhancements for Administrators by Eric Shupps Microsoft SharePoint Server 2010 for the ASP.NET Developer Eric Shupps on Following Best Practices and Avoiding Common Errors with Microsoft Office SharePoint Server 2007 Development Eric Shupps - SharePoint Performance and Capacity Planning Essentials Troubleshooting Common Performance Problems in SharePoint 2010 Videos by Eric Shupps eshupps The SharePoint Cowboy Channel 9 Interview with Eric Shupps SharePoint TechTalk with Eric Shupps - Different Views on Social Computing SharePoint Post-Deployment Planning and Management with Eric Shupps SmartTrack for SharePoint Feature Overview SmartTrack for SharePoint Podcasts by Eric Shupps eshupps The SharePoint Cowboy SharePoint Pod Show - Design for Performance (Eric Shupps) SharePoint Pod Show - Test Driven Development with Andrew Woodward and Eric Shupps eshupps The SharePoint Cowboy Run As Radio - Eric Shupps Improves SharePoint Performance
SmartTrack for SharePoint Eric Shupps Eric Alan Shupps eshupps @eshupps SharePoint Cowboy BinaryWave

 
​The SharePoint Cowboy


photo of  Eric Shupps
BinaryWave
611 S. Main St., Suite 400
Grapevine , TX , 76051 USA
Eric Shupps and Eric Alan Shupps with BinaryWave the BinaryWave Inc in BinaryWave Incorporated around SmartTrack beside SharePoint Monitoring through SharePoint alongside SharePoint Monitoring visiting @eshupps via eshupps near SharePoint performance and SharePoint management. The SharePoint cowboy eshupps BinaryWave and more on Operational Intelligence via Eric Alan Shupps SharePoint blog. SharePoint monitoring is a hot topic along with SharePoint Performance Measurement and SharePoint tips and tricks from Eric Shupps for SmartTrack. Another Eric Shupps on Technology and Eric Shupps on SharePoint with a new SharePoint Post from Eric Shupps. New BinaryWave post through BinaryWave Inc. and with another SharePoint blog we get to Eric Alan Shupps Blog about SharePoint development. That's Eric Shupps - BinaryWave or Eric Alan Shupps Fort Worth Grapevine Texas Dallas of BinaryWave talking about BinaryWave Operational Intelligence at the SharePoint Cowboy blog and on twitter as @eshupps. Of course SharePoint Administration is on topic for eshupps and another great post from Eric Shupps regarding BinaryWave SharePoint and SharePoint Maintenance.
December 05
Hiding Toolbars in the SharePoint 2010 Chart Web Part

SharePoint Server 2010 ships with a nifty Chart web part that displays visual data from a number of sources – SharePoint lists, BDC, Excel services, etc. It's a handy control and one that was sorely missing from the 2007 version. It provides a number of chart options, including pies, lines, bars, cones, scatters, etc. in both 2D and 3D. Neat…but (and there's always a 'but')…it has one very annoying characteristic that drives site administrators crazy. When you drop it onto the page, it displays a toolbar with links for "Data & Appearance" and "Advanced Properties" to everyone with more than basic read permissions, like so:

Eric Shupps Eric Alan Shupps eshupps @eshupps SharePoint Cowboy BinaryWave SmartTrack

 

We certainly don't want everyone to see that – too much temptation to click on those links and blow up our pretty little graphs. Well, ok, should be easy enough to turn that off, right? Wrong.

Somebody, somewhere, forget to include the ubiquitous hide toolbar switch that's on most other out of the box web parts. While trying to figure out a workaround for this nice little undocumented feature, I came across a lot of links to this blog post by Nick Grattan in which he suggests editing the page in SharePoint Designer and changing the web part properties manually in the markup. That's all well and good but anyone who has ever heard me speak at a conference knows that I am not exactly the world's biggest fan of using SPD to edit pages (that may be understating it a bit, sort of like saying the Pope is a little bit Catholic or Texas gets a bit warm in the summertime). So what to do?

Instead of hobbling performance by saving my page markup in the content db via SharePoint Destroyer, I instead opted for a little bit of JavaScript trickery to solve the problem. Turns out the chart web parts renders the toolbar content in a very predictable pattern:

Eric Shupps Eric Alan Shupps eshupps @eshupps SharePoint Cowboy BinaryWave SmartTrack

 

The < span > tag in which the toolbar resides is followed by an < img > tag that has a link to a specific page used to render the chart preview image. The < span > also follows an < input > control that is the first child of the parent < div >. That should be easy enough to find in the DOM and just unique enough to insure we don't turn off any other web part toolbars we might want. So, the following script, when added to the page in a hidden Content Editor web part, will hide those pesky toolbars by doing just a little bit of DOM walking:

< script type="text/javascript" >
var arr = document.documentElement.getElementsByTagName("img");
for (var i = 0; i < arr.length; i++)
{
    var imgSrc = arr[i].src;
    if (imgSrc.indexOf("ChartPreviewImage") != -1)
    {
        var parent = arr[i].parentNode;
        parent.childNodes[1].setAttribute("style","display:none");
    }
}
< / script >

If you prefer to use JQuery for messing around with the page DOM that works just fine as well (and probably with half as much code). Unfortunately, it means we have to add the content editor and script to every page our chart web parts are on, but it's better than saving the entire page back to the content DB in Designer.

Problem solved.

 

Comments

RE: Hiding Chart Web Part Toolbar

Applied exact copy of the script to a CEWP and nothing different. Still shows the toolbar. What did I miss?
 on 4/4/2012 2:44 PM

This doesn't seem to work for me...

I really want it to. I'm using SharePoint 2010 so I have added the script to a Txt file and connected a CEWP to it.

The toolbars are not hidden as expected.

Any ideas on what might be out of place?
 on 1/9/2013 4:27 PM

Not Loading

Use this one. It isn't loading the script fast enough.

<script type="text/javascript">
$(window).load(function() {

var arr = document.documentElement.getElementsByTagName("img");
alert(arr);
for (var i = 0; i < arr.length; i++)
{
    var imgSrc = arr[i].src;
    if (imgSrc.indexOf("ChartPreviewImage") != -1)
    {
        var parent = arr[i].parentNode;
        parent.childNodes[1].setAttribute("style","display:none");
    }
}
});
</script>
 on 2/21/2013 12:53 PM

Re: Hiding Toolbars in the SharePoint 2010 Chart Web Part

GENIUS
 on 2/21/2013 1:17 PM

Help

When I use the code you listed in the "Not Loading" thread above, I get an "Objected Expected" error at the $(window).load(function() {  line.  Any idea why that might be?

Your help is greatly appreciated.
 on 3/20/2013 11:32 AM

script tags

It wouldn't work for ma at first but I realised the '< script.. >' and '</script>' tags had spaces, after which it worked fine, cheers!
 on 5/1/2013 9:18 AM

Users with Read Access can't see it

You can also use permissions... create a custom group of Report Editors then in some "Reports Library" you only use for reports you can break permissions and give everyone else read access.
 on 12/2/2013 12:55 PM

getting a warning message

error message from webpage: [object HTMLCollection]
 on 9/8/2014 2:17 PM

CSS approach

You can accomplish it with a bit of CSS too, which has the benefit of working even if your users have javascript disabled for some reason.  The downside is you'll have to manually find the ID of the webpart yourself when you add the code to your CEWP, but this is easily accomplished through your browser's developer console.  You'll want the ID of the parent div that contains your chart image.  Insert it into the following code, and put the result into your CEWP:

<style type="text/css">
#WebPartctl00_m_g_12345678_abcd_1234_5678_abcd12345678 TABLE.ms-menutoolbar {
DISPLAY: none
}</style>

Simple!
 on 12/11/2014 12:52 PM

Add Comment

Items on this list require content approval. Your submission will not appear in public views until approved by someone with proper rights. More information on content approval.

Title


Body *


Comment Date *

Select a date from the calendar.
Enter the current date to prevent automated spambot comments.

Spam Prevention *


How many letters, not including spaces, does it take to spell "SharePoint Cowboy"?

Attachments

 
photo of Eric Shupps Eric Alan Shupps eshupps @eshupps SharePoint Cowboy BinaryWave Eric Shupps
BinaryWave
611 S. Main St., Suite 400
Grapevine , TX , 76051 USA

 
 
 
Eric Shupps Eric Alan Shupps eshupps @eshupps SharePoint Cowboy BinaryWave 

Eric Shupps LinkedIn Eric Shupps Twitter Eric Shupps Facebook Eric Shupps Google+
 
 

 


 


BinaryWave Eric Shupps eshupps The SharePoint Cowboy SharePoint monitoring SharePoint monitoring tool SharePoint metrics SharePoint administratrion SharePoint monitoring best practices SharePoint management SharePoint management tool SharePoint operations SharePoint operationsmanagement SharePoint administration SharePoint administration tool SharePoint SLA SharePoint service level agreement SharePoint operational intelligence SharePoint performance SharePoint performance monitoring SharePoint analytics SharePoint real-time SharePoint intelligence SharePoint ITIL SharePoint service operations SharePoint uptime SharePoint alerts SharePoint health SharePoint tools SharePoint metrics SharePoint diagnostics SharePoint SmartTrack SmartTrack Operational Intelligence


Copyright © 2013 BinaryWave, Inc. All rights reserved.
This site is brought to you by BinaryWave in cooperation with Eric Shupps Eric Alan Shupps eshupps @eshupps The SharePoint Cowboy. We hope you enjoy the SharePoint-related content on topics such as performance, monitoring, administration, operations, support, business intelligence and more for SharePoint 2010, SharePoint 2013 and Office 365 created by Eric Shupps The SharePoint Cowboy. We also hope you will visit our product pages to learn more about SmartTrack, Operational Analytics for SharePoint, SharePoint monitoring, and SharePoint administration, while also discovering great offers from our partners. Please visit the blog of Eric Alan Shupps, Twitter handle @eshupps, for more information on application development, the SharePoint community, SharePoint performance, and general technology topics. Eric Shupps Eric Alan Shupps eshupps @eshupps The SharePoint Cowboy is the founder and President of BinaryWave, a leading provider of operational support solutions for SharePoint. Eric Shupps Eric Alan Shupps eshupps @eshupps The SharePoint Cowboy has worked with SharePoint Products and Technologies since 2001 as a consultant, administrator, architect, developer and trainer. He is an advisory committee member of the Dallas/Ft. Worth SharePoint Community group and participating member of user groups throughout the United Kingdom. Eric Shupps Eric Alan Shupps eshupps @eshupps The SharePoint Cowboy has authored numerous articles on SharePoint, speaks at user group meetings and conferences around the world, and publishes a popular SharePoint blog at http://www.binarywave.com/blogs/eshupps.