如何使用Django正确执行此Ajax请求?

时间:2019-10-31 17:18:07

标签: python html django

我制作了一个表单,该表单包含一个名为 EmployeeWorkAreaLog 的模型的几个字段,第一个字段是一个人输入其员工编号的位置,该字段与一个名为的单独模型相关联拥有所有主要数据供验证的推销员。我将此函数设置为 get_employee_name(),该函数根据另一个模型的 Employee#返回名称,但是我不确定如何在页面中显示它,右上角,而人员在选项卡/单击进入表单的下一个字段后没有刷新吗?

我对html不太熟悉,但是我正在阅读ajax请求就可以解决问题,但是我不确定如何解决这个问题。在下面,您可以看到我的尝试,但是我不确定如何处理成功或如何正确地将其插入html。

基本上,这是为了让此人知道他们输入的员工编号与他们的姓名匹配,然后再继续填写其余信息。

views.py

class EnterExitArea(CreateView):
    model = EmployeeWorkAreaLog
    template_name = "operations/enter_exit_area.html"
    form_class = WarehouseForm

    def form_valid(self, form):
        emp_num = form.cleaned_data['adp_number']
        area = form.cleaned_data['work_area']
        station = form.cleaned_data['station_number']

        if 'enter_area' in self.request.POST:
            form.save()
            return HttpResponseRedirect(self.request.path_info)

        elif 'leave_area' in self.request.POST:
            form.save()
            EmployeeWorkAreaLog.objects.filter(adp_number=emp_num).update(time_out=datetime.now())
            return HttpResponseRedirect(self.request.path_info)


def get_employee_name(request):
    adp_number = request.GET.get('adp_number')
    employee = Salesman.objects.get(adp_number=adp_number)
    employee_name = employee.slsmn_name
    return employee_name

models.py

class EmployeeWorkAreaLog(TimeStampedModel, SoftDeleteModel, models.Model):
    adp_number = models.ForeignKey(Salesman, on_delete=models.SET_NULL, help_text="Employee #", null=True, blank=False)
    work_area = models.ForeignKey(WorkArea, on_delete=models.SET_NULL, null=True, blank=False, help_text="Work Area", related_name="work_area")
    station_number = models.ForeignKey(StationNumber, on_delete=models.SET_NULL, null=True, help_text="Station", related_name="stations", blank=True)
    time_in = models.DateTimeField(help_text="Time in", null=True, blank=True)
    time_out = models.DateTimeField(blank=True, help_text="Time out", null=True)

    def __str__(self):
        return self.adp_number

forms.py

class WarehouseForm(AppsModelForm):
    class Meta:
        model = EmployeeWorkAreaLog
        widgets = {
            'adp_number': ForeignKeyRawIdWidget(EmployeeWorkAreaLog._meta.get_field('adp_number').remote_field, site),
        }
        fields = ('adp_number', 'work_area', 'station_number')

    def __str__(self):
        return self.adp_number

urls.py

urlpatterns = [
    url(r'enter-exit-area/$', EnterExitArea.as_view(), name='enter_exit_area'),
    path('ajax/get-employee-name', views.get_employee_name, name='ajax_get_employee_name'),
]

enter_exit_area.html

{% extends "base.html" %}

{% block main %}
    <form id="warehouseForm" action="" method="POST" get-employee-name-url="{% url 'operations:ajax_get_employee_name' %} novalidate >
        {% csrf_token %}

        <div>
            <div>
                {{ form.adp_number.help_text }}
                {{ form.adp_number }}
            </div>
            <div>
                {{ form.work_area.help_text }}
                {{ form.work_area }}
            </div>
            <div>
                {{ form.station_number.help_text }}
                {{ form.station_number }}
            </div>
        </div>

        <div>
            <div>
                <button type="submit" name="enter_area" value="Enter">Enter Area</button>
                <button type="submit" name="leave_area" value="Leave">Leave Area</button>
            </div>
        </div>
    </form>

    <script>
        $("#id_adp_number").change(function () {
            var url = $("#warehouseForm").attr("get-employee-name-url");
            var adp_num = $(this).val();

            $.ajax({
                url: url,
                data: {
                    'adp_number': adp_num
                },
                success: function (response) {

                }
            });
        });
    </script>

{% endblock main %}

下面是存储所有原始数据的模型的一部分。 alldata / models.py

class Salesman(models.Model):
    slsmn_name = models.CharField(max_length=25)
    adp_number = models.IntegerField()

1 个答案:

答案 0 :(得分:0)

为什么不尝试以下方法:

1)将这样的路由添加到 urls.py

path('get-employee-name/<int:adp_num>/', views.get_employee_name, name='employee_name')

2)您需要一种方法来引用ADP编号表单字段,因此请在 models.py

中为其指定HTML id属性
class WarehouseForm(AppsModelForm):
    class Meta:
        model = EmployeeWorkAreaLog
        widgets = {
            'adp_number': ForeignKeyRawIdWidget(EmployeeWorkAreaLog._meta.get_field('adp_number').remote_field, site, attrs={'id':'adp_number_field'}),                                                
        }
        fields = ('adp_number', 'work_area', 'station_number')

    def __str__(self):
        return self.adp_number

(在attrs={'id':'adp_number_field'}内添加ForeignKeyRawIdWidget(),尽管不能完全确定这是否是正确的位置。)

您还需要一个HTML元素,该元素将包含并显示员工的姓名,因此在表单外部的某处添加这样的HTML元素: <p id='employee_name'></p>

3)和以前一样,使用AJAX来检测ADP编号字段中的更改,然后将POST发送到上面的URL,该URL返回员工姓名。

        $("#adp_number_field").change(function () {
            var adp_num = $(this).val();
            var url = 'get-employee-name/' + adp_num;

            $.ajax({
                url: url,
                type:'post',    
                data: {
                    'adp_number': adp_num
                },
                success: function (data) {
                    employee_name = data;
                    $('#employee_name')[0].innerHTML = employee_name;
                }
            });
        });

我没有测试过任何一个,这只是我的脑袋,但是这里应该有足够的东西让您走上正确的轨道。