Menu
How can I toggle a password field to text and password with a checkbox check uncheck?
488
is this what you looking for ??
<html>
<head>
<script>
function changeType()
{
document.myform.txt.type=(document.myform.option.value=(document.myform.option.value==1)?'-1':'1')=='1'?'text':'password';
}
</script>
</head>
<body>
<form name="myform">
<input type="text" name="txt" />
<input type="checkbox" name="option" value='1' onchange="changeType()" />
</form>
</body>
</html>
Use the onChange event when ticking the checkbox and then toggle the input's type to text/password.
Example:
<input type="checkbox" onchange="tick(this)" />
<input type="input" type="text" id="input" />
<script>
function tick(el) {
$('#input').attr('type',el.checked ? 'text' : 'password');
}
</script>
updated: live example here
changing type with $('#blahinput').attr('type','othertype') is not possible in IE, considering IE's only-set-it-once rule for the type attribute of input elements.
you need to remove text input and add password input, vice versa.
$(function(){
$("#show").click(function(){
if( $("#show:checked").length > 0 ){
var pswd = $("#txtpassword").val();
$("#txtpassword").attr("id","txtpassword2");
$("#txtpassword2").after( $("<input id='txtpassword' type='text'>") );
$("#txtpassword2").remove();
$("#txtpassword").val( pswd );
}
else{ // vice versa
var pswd = $("#txtpassword").val();
$("#txtpassword").attr("id","txtpassword2");
$("#txtpassword2").after( $("<input id='txtpassword' type='password'>") );
$("#txtpassword2").remove();
$("#txtpassword").val( pswd );
}
});
})
live example here
31
You can use some thing like this
$("#showHide").click(function () {
if ($(".password").attr("type")=="password") {
$(".password").attr("type", "text");
}
else{
$(".password").attr("type", "password");
}
});
visit here for more http://voidtricks.com/password-show-hide-checkbox-click/
34
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
