Dynamic value of HTML5 progress bar upon button click

html, javascript

Solution

Two things: You were missing a range for the bar and `getElementsByTagName` returns an array like object.

function myFunction() {
  var value = document.getElementById('txt').value;
  document.getElementsByTagName("PROGRESS")[0].setAttribute("value", value);
}

<input id="txt" placeholder="Enter total time">
<button onclick="myFunction()">Save</button>
<br/>
<progress id="pr" max="100"></progress>

Problem

I'm trying to update the value of a HTML5 progress bar upon entering a value in a text area and clicking a button. I'm assuming that I will only be entering properly formatted integer numbers in the text area. Here is the html: ``` <textarea id="txt" cols=20 rows=1 placeholder="Enter total time"></textarea> <button onclick="myFunction()">Save</button> <progress id="pr"></progress> ``` Here is the javascript: ``` function myFunction() { var value = document.getElementById('txt').value; document.getElementsByTagName("PROGRESS").setAttribute("value",value.parseInt()); }; ``` This doesn't seem to work. Any help is appreciated. PS: This is my first post here, how do I make the code all colorful and pretty? Edit: Seems like the code became colorful all by itself :)

Original source