Заполните форму HTML на основе предыдущего поля

Question

В настоящее время у меня есть очень простая форма HTML, которая выглядит примерно так:

<form>
   <label for="faccountNumber">Account Number</label>
   <input type="number" class="form-control" id="faccountNumber"><br><br>
   <label for="ffirstName">First Name</label>
   <input type="text" class="form-control" id="ffirstName"><br><br>
   <label for="fsurname">Surname</label>
   <input type="text" class="form-control" id="fsurname"><br><br>
</form>

Я хотел бы предварительно заполнить некоторые значения в зависимости от введенного номера счета. Это только для макета, и я просто хочу напечатать несколько примеров.

Например, если был введен номер счета 1789, я хотел бы автоматически предварительно ввести имя как John и фамилию как Smith. Как я могу это сделать?

Answer 1

Я предполагаю, что страница находится в аутентифицированном контексте, в противном случае у вас будут проблемы с безопасностью.
Задача должна быть выполнена на странице php.

/*   
 - get the user id from $_GET or anywhere you hold that info  
 - query the database for name and surname, filtering with the retrieved id  
 - assign values to $name and $surname variables  
*/    
<form>
   <label for="faccountNumber">Account Number</label>
   <input type="number" class="form-control" id="faccountNumber"><br><br>
   <label for="ffirstName">First Name</label>
   <input type="text" value="<?php echo $surname;?>" class="form-control" id="ffirstName"><br><br>
   <label for="fsurname">Surname</label>
   <input type="text" value="<?php echo $surname;?>" class="form-control" id="fsurname"><br><br>
</form>

Answer 2

Вы можете сделать это с некоторыми javascript, это грубое решение с использованием jquery:

$("#faccountNumber").bind('keyup mouseup', function () {
    let accountNum = $(this).val();
    if (accountNum == 1789) {
        $('#ffirstName').val("John");
        $('#fsurname').val("Smith");
    }           
});

Если вы хотите сделать его более динамичным c, вы можете извлечь данные с помощью ajax, но, как сказано в комментариях CD001 , вам следует избегать подобных вещей для любых конфиденциальных данных.