CODEWITHSUNDEEP
javascripthtml
D.Rotnemer
D.Rotnemer

Reputation: 203

Changing text of an html button by click on it

I have an html button, like this:

<button onclick="func()" id="accountDetails" runat="server"</button>

I already spent a lot of time scratching my head to find out how to change the button's text by click on it, I put the following func() that execute the onclick event (html):

<script type="text/javascript">
    function func() {
        document.getElementById('accountDetails').textContent = 'server';
    }
</script>

but the result is that the text on the button is changed just for a second, (i mean just when i click the button) and after that the old text is again shown on the button.

Upvotes: 0

Views: 7299

Answers (2)

Nguyen Manh Hoan FX17428
Nguyen Manh Hoan FX17428

Reputation: 1

const clickBtnHandler = (e) => {
    e.target.innerText = "new button text"; 
};

Upvotes: 0

D-Shih
D-Shih

Reputation: 46219

You can follow this html and script.

use input instead of button.

 <input onclick="func()" id="accountDetails" type="button" value="click"></input>

instead of 

<button onclick="func()" id="accountDetails" runat="server"</button>

Then the document.getElementById('accountDetails') need to set value instead of textContent 

function func() {
    document.getElementById('accountDetails').value  = 'server';
}
<input onclick="func()" id="accountDetails" type="button" value="click"></input>

Upvotes: 2

Related Questions