I'm tying to hide a custom tab from a page only if a specific webpart does not exist on the page. I have the following code to get the list of the webparts on the page. How can I hide the tab only if a webPart doesnot exists? In my code, the tab dissapears only if the webpart exists. Another thing, the Js code runs only once and after the page refresh or loaded again the tab shows again...

var siteUrl = '/sites/...';
var serverRelativeUrl = '/sites/...Default.aspx';

function updateWebPartTitle() {
    this.clientContext = new SP.ClientContext(siteUrl);
    var oFile = clientContext.get_web().getFileByServerRelativeUrl(serverRelativeUrl);
    var limitedWebPartManager = oFile.getLimitedWebPartManager(SP.WebParts.PersonalizationScope.shared);
    this.collWebPart = limitedWebPartManager.get_webParts();
    this.flag = 'no';
    clientContext.executeQueryAsync(Function.createDelegate(this, this.changeTitle), Function.createDelegate(this, this.onQueryFailed));

function changeTitle() {
    if (!collWebPart.get_count()) {
        alert('No Web Parts on this page.');
    } else {
        alert('webpart count on page:' + collWebPart.get_count());
    for (var i = 0; i < collWebPart.get_count(); i++) {
        var webPartDef = collWebPart.get_item(i);
        this.oWebPart = webPartDef.get_webPart();
        clientContext.load(oWebPart, 'Title');
        clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));

function onQuerySucceeded() {
    alert('Title for Web Part: ' + this.oWebPart.get_title());
    if (this.oWebPart.get_title() == 'web part title') {
        this.flag = 'yes';
        SP.SOD.executeOrDelayUntilScriptLoaded(function() {
            'use strict ';
            var tabIdToRemove = 'Ribbon.CustomTabExample';
            var pageManager = SP.Ribbon.PageManager.get_instance();
            var ribbon = pageManager.get_ribbon();
            // Remove the tab whose id is specified via the "tabId" argument.
            var removeTab = function removeTab(tabId) {
                var ribbon = pageManager.get_ribbon();
                // Select the "BROWSE" tab.
                SelectRibbonTab('Ribbon.Read', true);
                // Remove the specified tab.
                alert(tabId + " is being removed by javascript");
            // Add callback function after the ribbon object has been initialised.
            pageManager.add_ribbonInited(function() {
            // Ensure that the ribbon object has been initialised before using it.
            // Otherwise initialise it.
            if (ribbon) {
            } else {
                if (typeof _ribbonStartInit === 'function') {
                    _ribbonStartInit(tabIdToRemove, false, null);
        }, 'sp.ribbon.js');

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
  • Regarding jquery being fired only once, Is the Minimal Download Strategy Feature activated in your Site Settings->Site Features ? – Priyaranjan KS Aug 6 '17 at 9:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.