Заполните поле формы с помощью запроса AJAX - PullRequest
0 голосов
/ 07 февраля 2019

Я хотел бы заполнять поле формы Django каждый раз, когда в определенном поле выбирается раскрывающееся значение.

Пример:

У меня есть список предприятий (бизнес A, бизнес B, ...) и список стран.Каждый бизнес находится в определенной стране.

Business A --> France
Business B --> Germany
Business C --> England

В моей форме, когда я выбираю конкретный бизнес в своем dropdown list, я хотел бы сразу же заполнить поле страны соответствующей страной.Если бизнес изменится, ассоциированная страна тоже.

Я использую Django 1.11.18

Контекст:

В моем коде MemberState соответствует Стране, как в моем примере выше, а RBI соответствует бизнесу.

Моя модель:

class MemberState(models.Model):

    name = models.CharField(max_length=256, verbose_name=_('Name'))
    code = models.CharField(max_length=256, verbose_name=_('Code'))

class RBI(models.Model):

    short_name = models.CharField(max_length=256, verbose_name=_('Short name'), unique=True)
    member_state = models.ForeignKey(MemberState, verbose_name=_('Member State'))
    ...

Моя форма:

class FinalProductSearchForm(forms.Form):

    releasing_body = ShortNameModelChoiceField(queryset=RBI.objects.filter(active=True).order_by('short_name'), required=False,
            widget=forms.Select(), empty_label=_('Select'), label=_('Releasing Body/Institution'))
    member_state = forms.ModelChoiceField(queryset=MemberState.objects.filter(active=True).order_by('name'), required=False,
            widget=forms.Select(), empty_label=_('Select'), label=_('Member state'))
    ...

Я хотел бы выбрать releasing_body в моей форме и предварительно заполнить соответствующее поле member_state.Каждый раз, когда я изменяю realeasing_body, он загружает связанный member_state.

. Я пробовал некоторые вещи в Django, но мне нужен запрос AJAX.К сожалению, я никогда такого не делал.

Моя работа с AJAX-частью:

Итак, это моя первая попытка (котораяне работает):

Я создал эту функцию в своем файле views.py:

def ajax_member_state_request(request):
    if request.is_ajax():
        release_body = request.GET.get('releasing_body', None)
        print(release_body)
        member_state_ini = ReleaseBodyInstitution.objects.values_list('member_state', flat=True).get(id=release_body)
        print(member_state_ini)
        member_state = MemberState.objects.get(id=member_state_ini)
        print(member_state)
    return JsonResponse({'member_state': member_state})

В своем файле urls.py я добавил:

url(r'^finalproduct/list/$', FinalProductListView.as_view(),
    name='finalproduct-list'),
url(r'^finalproduct/list/ajax_member_state_request/$', views.ajax_member_state_request, name='ajax_member_state_request'),
* 1061И, наконец, в моем HTML-файле:
<form id="providerForm" data-provider-url="{% url 'ajax_member_state_request' %}" class="navbar-search" method="GET" action="{{ url }}">

{% csrf_token %}
    <div class="row">
      <div class="col-md-5">
        {{ search_form.releasing_body|as_crispy_field }}
      </div>
      <div class="col-md-5">
        {{ search_form.member_state|as_crispy_field }}
      </div>
    </div>

    <input type="submit" class="btn btn-default" value="{% trans 'Search' %}" />
    <input type="button" class="btn btn-default" name="clear" value="Reset" onclick="clearForm(this.form);">
</form>

AJAX-часть выглядит так:

$("#id_releasing_body").change(function () {
  var url = $("#providerForm").attr("data-provider-url");
  var releasingBodyId = $(this).val();

  $.ajax({
    url: url,
    type: 'GET',
    dataType: 'json',
    data: {
      'releasing_body': releasingBodyId
    },
    success: function (data) {
      $("#id_member_state").val(data.member_state);
    }
  });

});

Ответы [ 2 ]

0 голосов
/ 10 февраля 2019

Проверьте, подходит ли этот подход, я выполнил эти шаги для своего проекта и успешно заполнил поля выбора запросом AJAX.Единственная проблема заключается в том, что форма не является обязательной при отправке, несмотря на то, что значение выбрано во всех полях (работает над этим сейчас)

https://simpleisbetterthancomplex.com/tutorial/2018/01/29/how-to-implement-dependent-or-chained-dropdown-list-with-django.html

0 голосов
/ 07 февраля 2019

Я бы реализовал представление о том, что для данного названия компании возвращается JsonResponse со страной (следуя вашему примеру).

С учетом этого в разделе success запроса ajax установите value поля формы для страны.

Вид:

def contry_for_bussines(request):
    if request.is_ajax():
        member_state = ReleaseBodyInstitution.objects.get(id=release_body).member_state
    return JsonResponse({'member_state': member_state})

В ajax

$("#id_releasing_body").change(function () {
  var url = $("#providerForm").attr("data-provider-url");
  var releasingBodyId = $(this).val();

  $.get(url, {'releasing_body': releasingBodyId}, function(data){
       $("#id_member_state").text(data.member_state);
  });    
});
...