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

Sep 5 '08 #1

Martin Honnen

mike_solomon wrote:

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.
--

Martin Honnen
http://JavaScript.FAQTs.com/

Sep 5 '08 #2

mike_solomon

On 5 Sep, 13:12, Martin Honnen <mahotr...@yahoo.dewrote:

mike_solomon wrote:

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.
--

* * * * Martin Honnen
* * * *http://JavaScript.FAQTs.com/

Sorry I not sure how to to that

Can you give me an example pls

Sep 5 '08 #3

Martin Honnen

mike_solomon wrote:

>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

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 Honnen
http://JavaScript.FAQTs.com/

Sep 5 '08 #4

mike_solomon

On 5 Sep, 13:33, Martin Honnen <mahotr...@yahoo.dewrote:

mike_solomon wrote:

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

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 Honnen
* * * *http://JavaScript.FAQTs.com/

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 :(

Sep 5 '08 #5

mike_solomon

On 5 Sep, 13:58, mike_solomon <g...@solomontribe.co.ukwrote:

On 5 Sep, 13:33, Martin Honnen <mahotr...@yahoo.dewrote:

mike_solomon wrote:

>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

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 Honnen
* * * *http://JavaScript.FAQTs.com/

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';

Sep 5 '08 #6

mike_solomon

On 5 Sep, 13:58, mike_solomon <g...@solomontribe.co.ukwrote:

On 5 Sep, 13:33, Martin Honnen <mahotr...@yahoo.dewrote:

mike_solomon wrote:

>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

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 Honnen
* * * *http://JavaScript.FAQTs.com/

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';

Sep 5 '08 #7

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
--
http://photo.gregorkofler.at ::: Landschafts- und Reisefotografie
http://web.gregorkofler.com ::: meine JS-Spielwiese
http://www.image2d.com ::: Bildagentur für den alpinen Raum

Sep 5 '08 #8

hj

On Sep 5, 5:02*am, mike_solomon <g...@solomontribe.co.ukwrote:

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.

--

hj

Sep 6 '08 #9