Anuvrat Tiku Anuvrat Tiku - 1 year ago 172
CSS Question

How to insert a checkbox inside a input password field

I want my web page to display a check box inside the password field. User clicks on the check box and see the password as text. On un-check, its password again.

This is what I want. This is from the Ebay website login page.
enter image description here

This is what I am getting

enter image description here

I want this checkbox inside the password field. I could not find anything online on this topic.

Here is my code :

<!-- Set a password for the account -->
<div class="col-md-12" style="margin: 7px;">
<input type="password" id="reg_password" name="reg_password" style="height: 35px;" class="form-control input-lg" placeholder="Password" ng-model="register_password" />
<input type="checkbox" id="eye" onclick="if(reg_password.type=='text')reg_password.type='password'; else reg_password.type='text';" />

Answer Source

Just add CSS and move your checkbox to one group div with input text. See the example

#eye {

Click Here

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download