首页 > 解决方案 > 如何在 Django 中以复选框的形式使用 ajax 从不同的表中获取数据

问题描述

在这里,我想以复选框的形式获取我的联系人数据,但使用 ajax 调用,我可以引入下拉列表的形式,但是在进行更改以将其转换为复选框的形式后,它不起作用,谁能告诉我如何更改它

视图.py

def add_project(request):
    error = ""
    if not request.user.is_staff:
        return redirect('admin_login')

    cpphone = ''
    cpemail = ''

    cust1 = Customer.objects.all()
    if request.method == 'POST':
        d = request.POST['customer']
        c = request.POST['contactperson']
        pn = request.POST['pname']
        pl = request.POST['plength']
        pt = request.POST['ptype']
        pc = request.POST['pcost']
        ptech = request.POST['ptechnologies']
        psd = request.POST['psdate']
        ped = request.POST['pedate']
        pdesc = request.POST['pdescription']

        d1 = Customer.objects.get(customer_id=d)
        contactperson1 = Contactperson.objects.get(person_id=c)

        cpphone = Contactperson.objects.get(person_id=c).person_phone
        cpemail = Contactperson.objects.get(person_id=c).person_email

        # print(cpphone, cpemail)

        try:
            Allproject.objects.create(customer=d1, contactperson=contactperson1, contactpersondetails=cpphone, contactpersonemail=cpemail, project_name=pn, project_length=pl, project_type=pt,
                                      project_cost=pc, project_technologies=ptech, project_startdate=psd, project_enddate=ped, project_description=pdesc)

            error = "no"
        except:
            error = "yes"

    d = {'error': error, 'cust': cust1}
    return render(request, 'projectfolder/add_project.html', d)


def load_courses(request):
    cust_id = request.GET.get('customer')
    # print(cust_id)
    proj = Contactperson.objects.filter(customer_id=cust_id)
    return render(request, 'projectfolder/courses_dropdown_list_options.html', {'proj': proj})

add_project.html

在这里,我只以复选框的形式发布我想要的主要字段 见这里我有联系人以选择下拉列表的形式,但我希望每个值都以复选框格式

<form class="row g-3 my-3" method="POST" id="indexform" data-courses-url="{% url 'ajax_load_courses' %}">
  {% csrf_token %}
  <label>Customer Name</label>

  <select name="customer" id="customer" class="form-control">
    <option value="">---Select Customer----</option>

    {% for i in cust%}
    <option value="{{i.pk}}">{{i.customer_name}} [{{i.customer_id}}]</option>
    {% endfor %}
  </select>

  <label>Contact Person</label>
  <select required name="contactperson" id="contactperson" class="form-control">


  </select>
</form>

<script>
  $("#customer").change(function () {
    var url = $("#indexform").attr("data-courses-url");
    var customerId = $(this).val();
    console.log(customerId);

    $.ajax({
      url: url,
      data: {
        customer: customerId,
      },
      success: function (data) {
        $("#contactperson").html(data);
      },
    });
  });
</script>

course_dropdown_list_options.html

<option value="">----select Contact Person-----</option>

{% for i in proj %}
<option value="{{i.pk}}">{{i.person_name}}</option>
<!-- <input type="checkbox" name="contactperson" value="{{i.person_name}}">{{i.person_name}} -->
{% endfor %}

标签: djangodjango-ajax-selects

解决方案


嗨!与后端通信主要有两种方式。要么来自您适应的方法,要么通过 API(应用程序可编程接口)。如果您使用 Ajax,最佳实践是使用 API 端点。您只需在您提到的复选框上的事件上向端点发出请求,它将以 JSON 格式为您提供响应,然后您将以自己的方式使用该响应。流行的 REST 框架有 1:Django Rest Framework,对初学者来说有点难 https://www.django-rest-framework.org/ 2:Fast API 一种相对简单的方法 https://fastapi.tiangolo.com/ 3:Django忍者,我认为最简单的一个 https://django-ninja.rest-framework.com/


推荐阅读