Problem changing button type in IE using Javascript

[mike_solomon]

I have a button

<input type="submit" name="Delete" value="Delete">

This code can not be changed

I want to use Javascript to change the type

I tried:

document.DetailView.Delete.type='button'

This works perfectly in Firefox

But in IE I get the error

Error: Could not get the type property. This command is not supported

How can I do this in a way that works in IE

 

[Martin Honnen]

I have a button

<input type="submit" name="Delete" value="Delete">

This code can not be changed

I want to use Javascript to change the type

I tried:

document.DetailView.Delete.type='button'

This works perfectly in Firefox

But in IE I get the error

Error: Could not get the type property. This command is not supported

How can I do this in a way that works in IE

Create a new input element with the necessary properties, then replace
the 'submit' button with the 'button' button.

 

[mike_solomon]

Create a new input element with the necessary properties, then replace
the 'submit' button with the 'button' button.

Sorry I not sure how to to that

Can you give me an example pls

 

[Martin Honnen]

Sorry I not sure how to to that

Can you give me an example pls

Assume you have a reference named input to the submit button:

var newInput = document.createElement('input');
newInput.type = 'button'; // that should work even with IE
newInput.name = input.name;
newInput.value = newInput.defaultValue = input.value;
input.parentNode.replaceChild(newInput, input);

 

[mike_solomon]

Assume you have a reference named input to the submit button:

   var newInput = document.createElement('input');
   newInput.type = 'button'; // that should work even with IE
   newInput.name = input.name;
   newInput.value = newInput.defaultValue = input.value;
   input.parentNode.replaceChild(newInput, input);

Martin thats great

I have done the following

var input = document.DetailView.Delete
var newInput = document.createElement('input');
newInput.type = 'button';
newInput.name = input.name
newInput.value = newInput.defaultValue = input.value;
newInput.onclick =function fdelmsg(){alert(delmsg)};
newInput.setAttribute("class","button")
input.parentNode.replaceChild(newInput, input);

This works in Firefox & almost works in IE

The bit that doesn't work in IE is
newInput.setAttribute("class","button")

It doesn't give me an error but it doesn't change the button class
either

 

[Gregor Kofler]

mike_solomon meinte:

The bit that doesn't work in IE is
newInput.setAttribute("class","button")

That's because IE has its problems with setAttribute(). It's superfluous
anyway.

newInput.className = "button"; will do the job more efficiently and more
compatible.

Gregor

 

[mike_solomon]

Martin thats great

I have done the following

var input = document.DetailView.Delete
var newInput = document.createElement('input');
newInput.type = 'button';
newInput.name = input.name
newInput.value = newInput.defaultValue = input.value;
newInput.onclick =function fdelmsg(){alert(delmsg)};
newInput.setAttribute("class","button")
input.parentNode.replaceChild(newInput, input);

This works in Firefox & almost works in IE

The bit that doesn't work in IE is
newInput.setAttribute("class","button")

It doesn't give me an error but it doesn't change the button class
either

Final working solution

var input = document.DetailView.Delete
var newInput = document.createElement('input');
newInput.type = 'button';
newInput.name = input.name
newInput.value = input.value;
newInput.onclick =function fdelmsg(){alert(delmsg)};
input.parentNode.replaceChild(newInput, input);
newInput.className = 'button';

 

[mike_solomon]

Martin thats great

I have done the following

var input = document.DetailView.Delete
var newInput = document.createElement('input');
newInput.type = 'button';
newInput.name = input.name
newInput.value = newInput.defaultValue = input.value;
newInput.onclick =function fdelmsg(){alert(delmsg)};
newInput.setAttribute("class","button")
input.parentNode.replaceChild(newInput, input);

This works in Firefox & almost works in IE

The bit that doesn't work in IE is
newInput.setAttribute("class","button")

It doesn't give me an error but it doesn't change the button class
either

Final solution

var input = document.DetailView.Delete
var newInput = document.createElement('input');
newInput.type = 'button';
newInput.name = input.name
newInput.value = input.value;
newInput.onclick =function fdelmsg(){alert(delmsg)};
input.parentNode.replaceChild(newInput, input);
newInput.className = 'button';

 

[hj]

I have a button

<input type="submit" name="Delete" value="Delete">

This code can not be changed

I want to use Javascript to change the type

I tried:

document.DetailView.Delete.type='button'

This works perfectly in Firefox

But in IE I get the error

Error: Could not get the type property. This command is not supported

How can I do this in a way that works in IE

Just an FYI (the solutions in following posts were spot-on):

My guess is that IE doesn't *itself* implement any of the form
elements,
such as button, input, select, etc. Rather, it uses the underlying
Windows
controls. Those Windows control elements are immutable, so once you've
defined it in IE (by giving it a type and a name), you can't just
change
it to a different type of control simply by changing a property value.

At the time I was studying this, the rumor was that MS was considering
using browser-specific controls, rather than native Windows controls,
for
at least some such elements. But I don't know what happened with that.

This is a total pita -- if you need to change an element from one type
to
another, you need to create a new element, duplicate all the important
properties of the original, like name, id, classes and events, and
then
replace the original with the duplicate. Depending on the complexity
of
your application, this can be a *lot* more difficult than simply
changing
a single property on the original.

 

[Ravikumar Maddi]

Its very nice work. This procedure supports IE and FireFox also, no need
to do any browser checking.

 

[Evertjan.]

Ravikumar Maddi wrote on 31 aug 2009 in comp.lang.javascript:

Its very nice work. This procedure supports IE and FireFox also,

What is? What does?

[please always quote on usenet]

no need to do any browser checking.

A bad advice.

 

[Erik Reppen]

You guessed right HJ. To be fair, Safari appears to do the same thing
although it's less painful to actually work with. Form elements aren't
really very strictly specified in the standards. It's one of MS's
smaller victories, I suspect, their really huge victory being that
they've been completely ignoring everything they don't want to deal
with anyway pretty much since the closing of the browser wars.

 

[Evertjan.]

Erik Reppen wrote on 31 aug 2009 in comp.lang.javascript:

You guessed right HJ. To be fair, Safari appears to do the same thing

No, this is not fair, we don't know what and whom you are responding on.

[please always quote on usenet]

 

[Erik Reppen]

Erik Reppen wrote on 31 aug 2009 in comp.lang.javascript:

You guessed right HJ. To be fair, Safari appears to do the same thing

No, this is not fair, we don't know what and whom you are responding on.

[please always quote on usenet]

Sorry. Bad forum habit.

"You guessed right HJ. To be fair, Safari appears to do the same thing
although it's less painful to actually work with. Form elements aren't
really very strictly specified in the standards. It's one of MS's
smaller victories, I suspect, their really huge victory being that
they've been completely ignoring everything they don't want to deal
with anyway pretty much since the closing of the browser wars. "

was in response to: