Make hidden html input visible

I want to change the invisible html input to visible when I click the button as shown below. My html line that creates the hidden input:

<input type="hidden" id="txtHiddenUname" value="invalid input" /> 

my java script to change visibility

 var y = document.getElementById("txtHiddenUname"); y.style.display= "inline"; 

But this could not make the hidden element visible. Any ideas?

+4
source share
3 answers

You must change the input element type as:

  y.setAttribute('type','text'); //or y.type = 'text'; 

1) Any custom java script inside the body tag, as shown below:

 <input type="hidden" id="txtHiddenUname" value="invalid input" /> <script type="text/javascript"> var y = document.getElementById("txtHiddenUname"); y.type= "text"; </script> 

OR

2) Use some event handler like onload

 <head> <script type="text/javascript"> function on_load(){ var y = document.getElementById("txtHiddenUname"); y.type= "text"; } </script> </head> <body onload = "on_load()"> <input type="hidden" id="txtHiddenUname" value="invalid input" /> ... 

so that the DOM is ready.

+6
source

This is not a CSS question, it's an attribute question, so you need to change the type attribute from hidden to something else like text

Please check this [how-change-html-object-element-data-attribute-value-in-javascript] [1]

check this: How to change the value of the data attribute of an HTML object element in javascript . To change attribute value using jQuery or Javascript

+2
source
 <input type = "hidden", id = "abbriv", value = "Some Random Text"/> <script> function f1() { var x = document.getElementById("abbriv").value; document.getElementById("demo").innerHTML = x; } </script> 
0
source

Source: https://habr.com/ru/post/1491307/


All Articles