Blorner

Friday, April 29, 2011

Change input type from text to password for IE

Changing the type of input after page loaded is not supported in IE and here is an example how to do it using the other way:

<html>

<head>
<title>Change input type from text to password for IE</title>
</head>

<body>

<div id="password_field">
<input type="text" id="password" name="password" value="Password" onclick="change_pass_field_type_topass()" />
</div>

<script type="text/javascript">
function change_pass_field_type_topass(){
if(document.getElementById("password").value=="Password"){
var pass_new_field = document.createElement("input");

pass_new_field.name = "password";
pass_new_field.id = "password";

pass_new_field.type = "password";
pass_new_field.value = "";

pass_new_field.onblur = function(){
change_pass_field_type_totext();
}

document.getElementById("password_field").removeChild(document.getElementById("password"));

document.getElementById("password_field").appendChild(pass_new_field);

document.getElementById("password").focus();
}
}

function change_pass_field_type_totext(){
if(document.getElementById("password").value==""){
var pass_new_field = document.createElement("input");

pass_new_field.name = "password";
pass_new_field.id = "password";

pass_new_field.type = "text";
pass_new_field.value = "Password";

pass_new_field.onclick = function(){
change_pass_field_type_topass();
}

document.getElementById("password_field").removeChild(document.getElementById("password"));

document.getElementById("password_field").appendChild(pass_new_field);
}
}
</script>

</body>

</html>

No comments:

Post a Comment

Art Works Expo