The following javascript doesnt work in IE9, but works fine in Firefox. Any idea how to solve this? Thx.
var element = e.srcElement || e.target;
if(element != null){
if(element.tagName == "INPUT") {
//alert("Before: " + element.getAttribute("type"));
element.setAttribute("type", "password");
//alert("After: " + element.getAttribute("type"));
}
}
Since I've found that a plausible solution is to replace the element with a new one, you could use something like this:
var input = element;
var input2 = input.cloneNode(false);
input2.type = "password";
input.parentNode.replaceChild(input2, input);
Found here http://bytes.com/topic/javascript/answers/705445-dynamically-change-input-type-text-password and modified slightly. Another solution off there is to use createElement instead of cloning, but that might take some more work.
EDIT:
Forgot to mention that the problem seems to be that IE does not like changing the type attribute of an element dynamically after it has been included in the DOM.
Here are a few notes:
// ------------v---favor e.target
var element = e.target || e.srcElement;
// -----v---simple truthy test
if (element){
// ------------v---------v---- use nodeName, and toUpperCase() for safety
if (element.nodeName.toUpperCase() == "INPUT") {
// Not all IE respects the changing of the "type" on an input
element.setAttribute("type", "password");
}
}
I think the tagName representation may have changed in IE9. Using nodeName should guarantee upper case characters, but there are a couple rare bugs to avoid, so we use toUpperCase().
In the past, IE has not allowed a change of the "type" of an input element. Not sire if that's still the case in IE9, but certainly IE8 and lower won't allow this.
nodeName is the safe way to go, for legacy support and for moving forward, to get the "tag name"?
nodeName gives the upper case tag name, plus it gives representations for different types of nodes, so it's generally considered a good choice to standardize on it. However there are a couple of IE bugs in a couple narrow cases, so the .toUpperCase() is advised.toUpperCase (or toLowerCase) when needing to compare to a string. But I guess I really meant - has nodeName always been supported? I guess as I look at MDN, it seems to be fully supported, so that was probably a silly concern. And I also see what you mean by what is returned for different types of nodes. Good to know. Not that I use this very often (or ever), but something I will remember to stick with.tagNamenodeName THEN. :)
element.type = 'password'workstypeattribute dynamically. Some solutions I've found are to replace the element with a newly created one with the same specs.