I found this code in a previous post but I am not able to get this to work for me... I am trying to dynamically change an element's type from textbox to textarea with an event. Actually in my code i'm using a onClick event on a checkbox, but this is the original code exactly the way it was in the previous post... I tried to use it as it is and it errors out... Any input on how to make this code work or any other suggestions on how to accomplish what i'm trying to do would be appreciated...
[HTML]<script type="text/javascript">
function changeTextBox2TextArea( elementId ) {
var _el = document.getElementById( elementId );
var _parent = _el.parentNode;
// we remove the element from the DOM (optional as seen below...)
_parent.removeChild( _el );
// property is read-only so we replace the element
if ( _el.type == 'text' ) {
// IE doesn't like too much playing with DOM, so we use the
innerHTML method.
// Using innerHTML replace all current elements inside _parent with
the new
// elements specified in the string.
_parent.innerHTML = '<textarea id="' + _el.id + '">' + _el.value +
'</textarea>';
} else {
_parent.innerHTML = '<input type="text" id="' + _el.id + '"
value="' + _el.value + '" />';
}
_el = null; // remove any reference to the old element
}
</script>
<input type="button" value="Change Text Box"
onclick="changeTextBox2TextArea('test');" />
<div>
<input type="text" id="test" />
</div>[/HTML]