Disable the save button in list edit form ribbon

Question

Hi,

  I want disable the save button in ribbon, or at least the entire ribbon , from the edit form of a list...how can I do this using javascript. Thanks

Answer 1

Hi,

Please check the below article using javascript to hide ribbon control

http://blogs.msdn.com/b/sharepointdev/archive/2012/04/30/how-to-hide-the-ribbon-in-sharepoint-2010-rajeswari-mohandas.aspx

function ShowRibbon() {

   $("#s4-ribbonrow").show();

   $("#s4-workspace").height($(document).height() - $("#s4-ribbonrow").height() * 2);

}

function HideRibbon() {

   $("#s4-ribbonrow").hide();

   var newHeight = $(document).height();

   if ($.browser.msie) {newHeight = newHeight - 3; }

      $("#s4-workspace").height(newHeight);

}

_spBodyOnLoadFunctionNames.push("HideRibbon");

Regards,

---

Gnanasekhar K

Answer 2

Hi,

  I have already tried the same,but not working. Any jquery file reference required?

Answer 3

Hi hari,

If you are using v4.Master than I dont think you need to add any reference. Check in your master page if the reference is present if not than you will have to add it.

Regards,

---

Amish Trivedi

Answer 4

Ya..it works after including jquery-1.6.4.min.js. Great..Thank you. And is there is anyway to disable only the save button in ribbon , instead of the entire ribbon?..

Answer 5

 Hi Hari,

To hide just the Save button on the EditForm page, you can also use Jquery code.

Add a Content Editor Web Part on the page, and add the following script in the web part:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script><script type="text/javascript">

 


$(document).ready(function(){

document.getElementById("Ribbon.ListForm.Edit.Commit.Publish-Large").style.display="none";

});</script>

Thanks,

---

Qiao Wei
TechNet Community Support

Answer 6

hi 

you can completely use jquery instead of document.getElementById as 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){

$("#Ribbon\\.ListForm\\.Edit\\.Commit\\.Publish-Large").prop('disabled','disabled');

});</script>

Answer 7

Great Solution Ganansekhar. Bundle of thanks

Answer 8

You do not need to use any JS to hide the buttons you don't want.

All you have to do is edit the form in InfoPath, go to File >> Form Options >> and in Web Browser category uncheck all the buttons you do not need.

For screenshots go here:

https://praveensharepointknowledgebase.wordpress.com/2015/04/08/remove-ribbon-commands-save-save-as-close-views-for-infopath-published-forms/

It is always better to use built-in settings than to override in JS. Because the forms are auto refreshing every few seconds, you are then required to make your function a recurring one. If something in your code is wrong and you disable the wrong thing, you will not be able to stop the form in time for you to get into the ribbon. You'll need to stop all timers via JS and that's not easy for everyone... Also, you will force focus on the element you are hiding so when the form refreshes and you are editing some field and want to press a button in your form, you'll have to press x2 times, because the focus will go away from that control with every form refresh. They happen so quickly that the user doesn't notice them, and it drives them nuts.

Answer 9

At risk of responding to a two year-old answer to a five year-old question, InfoPath is deprecated. Yes it still works, but doing new development in InfoPath is not recommended.

The question was about JavaScript/jQuery, so I assume they're doing more current development using HTML5/CSS/JavaScript for forms.

Thus the solution is completely accurate and current, even today.

In our case, we want to get rid of the entire Commit section of the Ribbon - basically Edit & Cancel. So our code is:

$(document).ready(function() {

    document.getElementById("Ribbon.ListForm.Edit.Commit").style.display="none";

…

});