изменить входные данные в списке данных при изменении другого - PullRequest
0 голосов
/ 22 сентября 2019

У меня есть два ввода данных, как это.

<input list="Province" name="Province" id="1">
<datalist id="Province">
       {% for item in province_list %}
           <option >{{item.Name}}</option>
       {% endfor %}
</datalist>

<input list="City" name="City" id="2">
<datalist id="City">
       {% for item in city_list %}
           <option >{{item.Name}}</option>
       {% endfor %}
</datalist>

Я хочу, когда пользователь выбирает провинцию, я показываю список городов этой провинции в input2.

1 Ответ

0 голосов
/ 22 сентября 2019

Я использую JavaScript, как показано ниже:

    $("input[name=Province]").on('input', function () {
        province = $(this).val();
        dataList.empty();
        $.ajax({
            url: "/get_cars_"+province,
            dataType: 'json',
            success: function (data) {
                console.log(data);
                for (var i = 0, len = data.length; i < len; i++) {
                    $("input[name=City]").append("<option value='" + 
                     data[i].city + "'></option>");

                }
            },
            error: function (req, status, err) {
                console.log('something went wrong', status, err);
            }
        });
 });

В запросе "/ get_cities_ \ w +" на стороне сервера.
Удалить второй оператор "for" в HTML-коде:

<datalist id="City">
</datalist>

Код на стороне сервера в Django:

def getTheVendorProducts(request):
    if request.is_ajax():
    try:
        uriQueri = request.build_absolute_uri()
        province = uriQueri.split('_')[]
        province = urllib.parse.unquote(province.split('?')[0])
        vendorProduct= getTheCitiesOfprovince(province)
        return HttpResponse(convertListToJson(vendorProduct), 'application/json')
    except Exception as e:
        logging.error(e)
        return failedHttpResponse()

Вам необходимо определить свои собственные функции "getTheCitiesOfprovince" и "convertListToJson".Посетите здесь Для получения дополнительной информации о типах вопросов.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...