Выпадающий конфигуратор Геоданных не показывает страны

#javascript #python #html #flask #jinja2

#javascript #python #HTML #фляжка #jinja2

Вопрос:

Я решил использовать короткий метод получения выпадающего списка стран и штатов с помощью конфигуратора геоданных:

 <select name="country" class="countries order-alpha" id="countryId">
    <option value="">Select Country</option>
</select>
<select name="state" class="states order-alpha" id="stateId">
    <option value="">Select State</option>
</select>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="//geodata.solutions/includes/countrystate.js"></script>
 

Я понимаю, что это отлично работает в JSBin, но я не могу заставить его работать на моем сайте (Flask / Jinja).

Я скопировал и вставил, как вы видите здесь (хотя я переместил теги сценария в нижнюю часть над {% endblock %} моего шаблона).

Тот факт, что код работает на JSBin, но просто ничего не дает мне на моем сайте: https://gyazo.com/a67c8f738e95d57efac2c74e426c37b1

Заставляет меня поверить, что это какая-то путаница с Python или другим скриптом JS.

У меня есть <script src="https://code.jquery.com/jquery-3.5.1.min.js "... и <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"> обе загрузки тоже (из базового шаблона).

Из того, что я могу сказать, все скрипты загружены. Любая другая причина, по которой выпадающий список select не работает?

Ответ №1:

Я Энди, разработчик geodata.solutions. Трудно сказать, в чем проблема, не видя вашего приложения, но общие вещи применимы: -Используйте консоль веб-разработчика, чтобы посмотреть, не появилось ли что-нибудь. -Мои первоначальные мысли, если не возникают ошибки js, заключаются в том, что у вас есть другой элемент с идентификатором CountryId, и именно поэтому он не меняет раскрывающийся список. -Если вы создаете локальную копию countrystate.js и, используя это, вы можете добавлять журналы консоли к различным событиям, чтобы увидеть, в чем проблема. Это та начальная функция this.getCountries, на которую вы хотите посмотреть, которая запускается функцией внизу

 jQuery(function() {
    var loc = new locationInfo();
    loc.getCountries();
    jQuery(".countries").on("change", function(ev) {
        var countryId = jQuery("option:selected", this).attr('countryid');
        if(countryId != ''){
            loc.getStates(countryId);
        }
        else{
            jQuery(".states option:gt(0)").remove();
        }
    });
    jQuery(".states").on("change", function(ev) {
        var stateId = jQuery("option:selected", this).val();
        if(stateId != ''){
            loc.confCity(stateId);
        }
    });

});
 

-Я не разработчик python, поэтому, если это связано с конфликтом с python, то у кого-то с таким опытом может быть опыт.

Пожалуйста, дайте мне знать, как у вас дела. Все, что я могу сделать, чтобы сделать его более нейтральным к платформе, приветствуется.

Комментарии:

1. Большое спасибо, что перезвонил мне, Энди. Я ценю это. Кажется, я нашел проблему. Я не думаю, что ваш API совместим с элементами Materialize «select».

2. Из любопытства, как я могу сделать локальную копию countrystate.js ? Я не знаком с тем, как найти этот файл через ваш сайт. На данный момент я создаю JSON-файл, который решит мою проблему и запустит его на python (когда я придумаю, как это сделать). Но если бы у меня был локальный файл, это сэкономило бы время на вызове API.