Tuesday 29 November 2011

Password field shows password as default value in Mozilla in Cakephp

Here a peculiar problem i face while creating a user settings page in Cakephp , At FireFox browser, password field shows a default value as password after page got loaded or even if i click at that element.
$this->Form->password('User.password',array('id'=>'password','class'=>'pass'));
every time page gets loaded it shows ******* in password field , default is password text in password field, so to overcome this problem i used a Trick as follows..

echo $this->Form->input('users_check',array('id'=>'pass_input','label'=>false,'div'=>false));
echo $this->Form->password('users_passnew',array('id'=>'pass_password'));
i create a password element and a input element now, as there is an plain input field it will not show any default Asterisk. and when user click on to that input control the following Jquery will run and will hide the input field and show the actual password field.
<script>
$(document).ready(function(){

$('#pass_password').hide(); //hide the password element when page is ready
       $('#pass_input').focus(function(){ 
      $('#pass_input').hide(); //hide the input field
     $('#pass_password').show(); //show the password field
     $('#pass_password').focus();
      });
});

</script>

2 comments:

  1. much more easy would be:

    echo $this->Form->input('password', array('autocomplete' => 'off', 'value' =>
    ''));

    ReplyDelete