I want to make my sign up form simples. I want to hide the password2 field and copy the value entered in password field automatically to password2 field. I tried a javascript but it did not work. This is what i tried.
<td><span class="smalltext">{$lang->password}</span></td>
<td><span class="smalltext">{$lang->confirm_password}</span></td>
</tr>
<tr>
<td><input type="password" class="textbox" name="password" id="password" style="width: 100%" /></td>
<td><input type="password" class="textbox" name="password2" id="password2" style="width: 100%" /></td>
</tr>
<tr>
<td colspan="2" style="display: none;" id="password_status"> </td>
</tr>
<script>
$(function(){
var $foo = $('#password');
var $bar = $('#password2');
function onChange() {
$bar.val($foo.val());
};
$('#password')
.change(onChange)
.keyup(onChange);
});
</script>
The input event will handle all events that modify value, including pasting, typing, etc. so I would recommend that over trying to capture all other possible events
const passwordInput2 = document.querySelector('#password2');
document.querySelector('#password').addEventListener('input', (event) => {
passwordInput2.value = event.target.value;
});
<input type="password" class="textbox" name="password" id="password" style="width: 100%" />
<input type="password" class="textbox" name="password2" id="password2" style="width: 100%" />