Как вызвать обработчик событий, когда значение в текстовом поле в ASP.NET приложение razor pages изменилось?

---

Я создаю веб - приложение, используя ASP.NET ядро 3.1. существует таблица данных(FamCode), которая имеет два столбца: FamilyCode (ключевое поле) и FamilyName. На странице, которая позволяет пользователю добавить нового человека, есть несколько полей. Среди них есть FamilyCode и FamilyName. Когда код семейства вводится и пользователь выходит из поля, я хочу вызвать событие, которое запрашивает таблицу FamCode, используя значение в поле FamilyCode, чтобы выбрать имя семейства, а затем заполнить поле FamilyName этим значением.

Если я добавлю кнопку на страницу, Я могу запустить обработчик событий. Мне нужно, чтобы обработчик событий запускался автоматически, когда значение в семействеПоле кода изменено.

Когда я запускаю код, обработчик никогда не вызывается. Мой код прилагается, надеюсь, кто-то может сказать мне, что я делаю неправильно. Любые предложения или идеи о том, как это сделать, приветствуются.

Что я уже пробовал:

<form method="get" >
    <div class="border backgroundWhite">
        <div class="form-group row">
            <div class="col-2">
                <label asp-for="PublisherFamilyVM.PubDataList.LastName"></label>
            </div>
            <div class="col-6">
                <input asp-for="PublisherFamilyVM.PubDataList.LastName" class="form-control" />
            </div>
            <span asp-validation-for="PublisherFamilyVM.PubDataList.LastName" class="text-danger"></span>
        </div>
        <div class="form-group row">
            <div class="col-2">
                <label asp-for="PublisherFamilyVM.PubDataList.FirstName"></label>
            </div>
            <div class="col-6">
                <input asp-for="PublisherFamilyVM.PubDataList.FirstName" class="form-control" />
            </div>
            <span asp-validation-for="PublisherFamilyVM.PubDataList.FirstName" class="text-danger"></span>
        </div>

        <div class="form-group row">
            <div class="col-2">
                @Html.LabelFor(m => m.PublisherFamilyVM, "Family Code/Name:")
            </div>
            <div class="col-2">
                <input id="input_family_code" class="form-control" type="text" 
                 value="" onblur="getfamilyname();" />
            </div>

            <div class="col-4">
                <input id="input_family_name" class="form-control" type="text" 
                  value="" />
            </div>
            <span asp-validation-for="PublisherFamilyVM.PubDataList.FamilyCode" 
             class="text-danger"></span>
        </div>


        <div class="form-group row">
            <div class="col-6 offset-2">
                <partial name="_CreateAndBackToListButton" />
            </div>
        </div>
    </div>
</form>


@section Scripts{
    @{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }

<script>
    function getfamilyname() {
        var familycode = $("#input_family_code").val();

        if (familycode != "") {
            $.getJSON(`/eventinfo?handler=FamilyNameByCode&familycode=${familycode}`, 
              function (data) {
                $("#input_family_name").empty();
                $("#input_family_name").val(data);
            });
        }
</script>

}

    //***** PageModel *****
    
            public JsonResult OnGetFamilyNameByCode(string familycode)
    
            {
                //code logic here
                //retrieve data from database based on famiycode
                return new JsonResult(familycode);
            }

---