Блог

Как автоматически заполнить состояние, введя почтовый индекс. У меня есть база данных почтовых индексов. Как проверить с помощью формы. Если пользователь вводит почтовый индекс, который доступен в этой базе данных, используя этот почтовый индекс, состояние должно автоматически заполняться, как указано ниже datbase. Если почтовый индекс совпадает, то состояние должно автоматически заполняться.

Я реализовал это с помощью API. Но я знаю, что я имею отношение к базе данных:

     INSERT INTO pages_zip_code (id, zip, city, st) VALUES
    (1, '00501', 'Holtsville', 'NY'),
    (2, '00544', 'Holtsville', 'NY'),
    (3, '00601', 'Adjuntas', 'PR'),
    (4, '00602', 'Aguada', 'PR'),
    (5, '00603', 'Aguadilla', 'PR'),
    (6, '00604', 'Aguadilla', 'PR'),
    (7, '00605', 'Aguadilla', 'PR'),
    (8, '00606', 'Maricao', 'PR'),
    (9, '00610', 'Anasco', 'PR'),
    (10, '00611', 'Angeles', 'PR'),
    (11, '00612', 'Arecibo', 'PR'),
    (12, '00613', 'Arecibo', 'PR'),
    (13, '00614', 'Arecibo', 'PR'),
    (14, '00616', 'Bajadero', 'PR'),
    (15, '00617', 'Barceloneta', 'PR'),
    (16, '00622', 'Boqueron', 'PR');
  

urls.py `

     path('autostate', views.autostate, name='autostate'),
  

views.py

     def autozip(request):
    if 'term' in request.GET:
    qs = zip_code.objects.filter(zip__istartswith=request.GET.get('term'))
    zip_list = list()
    for zip_c in qs:
    zip_list.append(zip_c.state)
    return JsonResponse(zip_list, safe=False)
    return render(request, 'home.html')
  

html-страница

 <input class="InputZip" name="Zip" placeholder="Zip Code" type="text">
<input class="Inputstate" name="state" placeholder="State" type="text">
  

 
    <script>
    function is_int(value) {
    if ((parseFloat(value) == parseInt(value)) amp;amp; !isNaN(value)) {
    return true;
    } else {
    return false;
    }
    }
    $(".InputZip").keyup(function() {
    // Cache
    var el = $(this);
    // Did they type five integers?
    if ((el.val().length == 5) amp;amp; (is_int(el.val()))) {
    // Call Ziptastic for information
    $.ajax({
    url: '{% url 'autostate' %}',
    cache: false,
    dataType: "json",
    type: "GET",
    success: function(result, success) {
    $(".Inputstate").val(result.state_short);
    },
    });
    }
    });
    </script>