Question 310448 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

Jquery – How do I replace the text label of a button using javascript and without having to click?

I am trying to change the label of the ‘Save’ button to ‘Next’ using javascript and without having to click on Save first.

Save button

<input type="button" name="ctl01$SaveButton" value="Save" onclick="if(this.disabled)return false;accountCreatorInstance_ctl01_TemplateBody_WebPartManager1_gwpciNewContactAccountCreatorCommon_ciNewContactAccountCreatorCommon.ShowErrors();if(!RunAllValidators(new Array('52503d2c-d362-4864-a72d-5f883619889d'), true)) return false;this.disabled='disabled';WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl01$SaveButton&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, true))" id="ctl01_SaveButton" title="Save" class="PrimaryButton TextButton Save" data-ajaxupdatedcontrolid="ContentDiv" translate="yes">

I’ve tried many different versions but nothing seems to work. I’m no JS expert so any help is appreciated.

document.getElementById(‘ctl01_SaveButton’).innerHTML = ‘Next’;

I just want the Save button to show ‘Next’ instead of Save.

Tags:

2

Answers


  1. 0

    use value, not innerHTML property to change things here.

    document.getElementById('ctl01_SaveButton').value = 'Next';
    Login or Signup to reply.
  2. 0

    It looks like your button is an <input> element with the value attribute set to "Save". To change the text on the button using JavaScript, you should update the value attribute. Here’s how you can do it:

    document.getElementById('ctl01_SaveButton').value = 'Next';

    This line of code finds the element with the ID ‘ctl01_SaveButton’ and updates its value attribute to ‘Next’, effectively changing the text displayed on the button.

    Make sure to execute this JavaScript code after the page has loaded or after the button element has been created in the DOM. You can place the script in a <script> tag at the end of your HTML body or use an event listener to run the code when the document is ready.

    document.addEventListener("DOMContentLoaded", function() {
    // Your code to change the button text here
    document.getElementById('ctl01_SaveButton').value = 'Next';
});

    This ensures that the script runs after the HTML has been fully loaded.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search