Ошибка при передаче переменной JQuery в Django

Попутно с изучением Django изучаю и JQuery. Есть class Map в models.py Django. Есть страница с формами для отбора. Поля: Страна, Сфера, Показатель, Период и т.д. После выбора в одном из полей в следующем происходит фильтрация (ajax-запрос к серверу). Для первого поля всё работает идеально: выбираю 'Россия', и поле Сфера оставляет только те варианты, которые уже имеют экземпляры класса Map. Далее кликаю по Сфере. Выбираю 'Экономика', и поле 'Показатель' просто очищается. С помощью отладчика посмотрел, что в случае с первым выбором в ajax-запрос передаётся верный аргумент 'Россия', а при втором выборе - ${b} вместо 'Экономика'. Так что полагаю ошибка в том, что я неправильно определил значение поля activity как $(this).val(). Я даже примерно понял логику почему так (видимо потому, что методом html() дописывал строки в html-код), но не понимаю, как сделать правильный запрос.

<section class="site_filter">
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-2 col-2">
                    <div class="form-group">
                        <label for="country">Country</label>
                        <select class="form-control" id="country">
                        <option value='None'>Выберите страну</option>
                         {% for obj in country %}
                            <option value='{{obj}}'>{{obj}}</option>
                                {% endfor %}
                        </select>
                    </div>
                </div>
                <div class="col-sm-2 col-2">
                    <div class="form-group">
                        <label for="Activity">Activity</label>
                        <select class="form-control" id="activity"> 
                        <option value='None'>Выберите сферу</option>
                                {% for obj in activity %}
                            <option value='{{obj}}'>{{obj}}</option>
                                {% endfor %}
                        </select>
                    </div>
                </div>
                <div class="col-sm-2 col-2">
                    <div class="form-group">
                        <label for="subactivity">Sub-Activity</label>
                        <select class="form-control" id="subactivity"> 
                        <option value='None'>Выберите показатель</option>
                                {% for obj in subactivity %}
                            <option value='{{obj}}'>{{obj}}</option>
                                {% endfor %}
                        </select>
                    </div>
                </div>
             </div>
        </div>
    </section>

Код JQuery (размещается в том же html)

<script> 
      /* Для кнопки со страной */
      /* jshint esversion: 6 */
         $('#country').click(function(event){
         event.preventDefault();
           $.ajax({
                type : "GET", 
                url: "{% url 'info:get_activity' %}",
                data: {
                 "country" : $(this).val(),
                 "csrfmiddlewaretoken": '{{ csrf_token }}',
                 "dataType": "json",
         
                },
                success: function(response){
                let activity = response["activities"];
                let activity_option = '';
                $.each(activity, function (a, b) {
                activity_option += "<option value='${b}'>" + b + "</option>";
            });
            $("#activity").html(activity_option);
                },
         
        error: function(response){
            console.log(response);
        }
            });
                 });    
                 
                
  /* Для кнопки со cферой */
         $('#activity').click(function(event){
         event.preventDefault();
           $.ajax({
                type : "GET", 
                url: "{% url 'info:get_subactivity' %}",
                data: {
                 "activity" :  $(this).val(),
                 "csrfmiddlewaretoken": '{{ csrf_token }}',
                 "dataType": "json",
         
                },
                success: function(response){
                let subactivity = response["subactivities"];
                let subactivity_option = '';
                $.each(subactivity, function (a, b) {
                subactivity_option += "<option value='${b}'>" + b + "</option>";
            });
            $("#subactivity").html(subactivity_option);
                },
         
        error: function(response){
            console.log(response);
        }
            });
                 });    
      </script>

Вернуться на верх