Changing input element type

[mrsquash]

I have a radio button group on my form.  When one of the buttons is selected I am using an "onclick" event to call a function. I want this function to change the input type of a text field from hidden to text.  I keep getting an error message that parentNode is null or not an object.  Below is my code.  Any ideas?

 

My button set:

<input type="radio" tabindex="49" name="suspended" value="Y" onclick="javascript:showDate('suspend_date', 'hidden');"><span class="small">Yes</span> 
<input type="radio" name="suspended" value="N" /><span class="small">No</span>

 

My input element I want to update:

<input type="hidden" tabindex="50" value="" size="10" maxlength="25" name="suspend_date">

 

My javascript function to update the element:

function showDate(oldObject, oType) {
  var newObject = document.createElement('input');
  newObject.type = "text";
  if(oldObject.size) newObject.size = oldObject.size;
  if(oldObject.value) newObject.value = oldObject.value;
  if(oldObject.name) newObject.name = oldObject.name;
  if(oldObject.id) newObject.id = oldObject.id;
  if(oldObject.className) newObject.className = oldObject.className;
  oldObject.parentNode.replaceChild(newObject,oldObject);
  return newObject;
}

[emehrkay]

give the hidden field an id, and pass that id to your function

 

in your function do

 

document.getElementById('id of field').type = 'text';

[mrsquash]

So something like this?

function showDate(id) {
  document.getElementById('id').type = 'text';
  var newObject = document.createElement('input');
  newObject.type = "text";
  if(oldObject.size) newObject.size = oldObject.size;
  if(oldObject.value) newObject.value = oldObject.value;
  if(oldObject.name) newObject.name = oldObject.name;
  if(oldObject.id) newObject.id = oldObject.id;
  if(oldObject.className) newObject.className = oldObject.className;
  oldObject.parentNode.replaceChild(newObject,oldObject);
  return newObject;
}

[emehrkay]

no. why do you need to create a new element when it already exists?

 

you have

 

<input type="hidden" id="some_id" />

 

in your function do

 

document.getElementById('some_id').type = 'text';

 

thats all you need to do

[mrsquash]

I was under the impression that to get it to work with Internet Explorer you had to create a new element and remove the old element.

 

Okay, I changed it to this:

 

My button set:

<input type="radio" tabindex="49" name="suspended" value="Y" onclick="javascript:showDate();"><span class="small">Yes</span> 
<input type="radio" name="suspended" value="N" /><span class="small">No</span>

 

My input element I want to update:

<input type="hidden" tabindex="50" value="" size="10" maxlength="25" name="suspend_date" id="1">

 

My javascript function to update the element:

function showDate() {
  document.getElementById('1').type = 'text';
}

 

And it gives me the following: Could not get the type property. This command is not supported.

[emehrkay]

try changing the id to something that is valid like a string.

 

this code works, i just tried it on this page