CODEWITHSUNDEEP
javascriptjqueryinternet-explorer
Mild Fuzz
Mild Fuzz

Reputation: 30671

How can I make this jQuery work in IE explorer?

Working with the following code to dynamically change the submit buttons to image based buttons.

marker2 = jQuery('<span class="marker"> </span>').insertBefore('input#ResetDatesButton');
jQuery('input#ResetDatesButton').detach().attr('type', 'image').attr('src',theme_folder+'/style/images/ResetDatesButton.png').insertAfter(marker2);
marker2.remove();

This works beautifully in FF, Chrome and Safari but fails totally in IE6, 7 and 8. Then button is removed, but not replaced. How can I achieve the same result in IE?

Upvotes: 0

Views: 187

Answers (2)

Erick Petrucelli
Erick Petrucelli

Reputation: 14872

Internet Explorer doens't allow input[type] changes on the fly. Here is another thread discussing it: change type of input field with jQuery

Then, jQuery can do nothing to it works.

You will to:

  • Use CSS on your input[type=button] to show the image you want and hide the text.
  • Or hide the input, put an a tag with the image you want and set the click() to call the input.click().

EDIT:

Here is a little sample showing how to replace the input[type=button] with another control (you can use CSS to show it how you want) and then trigger the button click as well.

Upvotes: 1

herostwist
herostwist

Reputation: 3958

IE doesn't allow you to dynamically change the type attribute of form inputs. The only option you have is to delete the element and replace it with a new one of the correct type,

Upvotes: 3

Related Questions