Change Button Text in SharePoint Using JavaScript

Let's learn the tricks which you can use to customize SharePoint default Add/Edit forms.

Scenario

When you are adding any item to a SharePoint list, you will have the form given below.

SharePoint

Sometimes, based on the requirement, we need to change the text of the button from "Save" to "Confirm" or "Insert" or any other text.

Thus, I am sharing one of the common approaches which you can use to change the text of the input button of the list, where the default is Add/Edit form.

Solution

  • Step 1
    Open Add/Edit form of SharePoint list.

  • Step 2
    Click Setting icon and select "Edit the page".

  • Step 3
    Insert Content Editor Web Part on the page and write the code given below into CEWP and save the page
    1. <script type="text/javascript">  
    2.     function UpdateButtonText() {  
    3.         var submitButtons = document.getElementsByTagName("input");  
    4.         for (i = 0; i < submitButtons.length; i++) {  
    5.             if (submitButtons[i].type == "button" && submitButtons[i].value == "Save")  
    6.                 submitButtons[i].value = "Send Email";  
    7.         }  
    8.     }  
    9.     _spBodyOnLoadFunctionNames.push("UpdateButtonText");  
    10. </script>  
  • Step 4
    Once the page is saved, you will able to find the new updated text instead of default "Save". 


Thus you are done. Similarly, you can change the text at Edit form also.

Ebook Download
View all
Learn
View all