0

I would like to remove the "Mark Task Complete" button from the Task Ribbon on my Project Web App to prevent users from clicking on it. I have been successful in adding a custom JavaScript Web Part to hide the button after a 200 millisecond delay because the JavaScript has to wait for the page to load. However, this not only leads to a bad user experience but also it is not guaranteed that the page will fully load in 200 milliseconds and thus leaves the possibility of the users seeing the button and being able to interact with it. Here is that JavaScript.

<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $("li.ms-cui-tt a:eq(1)").trigger("click");

});

window.onload = function(){
 setTimeout(function(){
   document.getElementById('Ribbon.ContextualTabs.MyWork.Home.Tasks.MarkComplete-Large').style.display = 'none';
 }, 200);
};

</script>
</body>
</html>

Is there a way to accomplish the desired affect without using a delay?

Spencer
  • 13
  • 2

1 Answers1

0

You can use CSS for the same result, note that you have to substitute the dot in the class name with \.

It should look a bit like this (In a Scritp Editor Web Part on the Page): <style type="text/css"> #Ribbon.ContextualTabs.MyWork.Home.Tasks.MarkComplete-Large { display: none } </style>

Klaus Kuplen
  • 56
  • 3
  • Are you saying that it should look like this: ` ` It won't let me format it any better so I apologize if it looks bad – Spencer Aug 17 '16 at 15:59
  • What i mean is using CSS to handle you buttons rather than Javascript. I'll change the text above – Klaus Kuplen Aug 18 '16 at 10:20
  • Adding that script to a Script Editor Web Part does not make the button disappear. In the console log, it says that the "element" does not exist. The element doesn't exist because the button is not visible until the user clicks on the ribbon, which was what the first part of my JavaScript was trying to simulate. – Spencer Aug 18 '16 at 18:46