Django如何将筛选后的员工列表传至前端渲染为单选按钮供用户选并输价格提交

1. 视图层传递员工数据到模板 #

你已经完成了员工数据的筛选，只需要在返回模板响应时把筛选结果放到上下文变量中即可完成数据传递，示例代码如下：

from django.shortcuts import render

def 你的视图函数名(request):
    # 你原有业务逻辑保留
    staff = User.objects.filter(is_staff=True)
    # 构造上下文字典传递到前端
    context = {
        "staff_list": staff
    }
    return render(request, "你的前端模板文件名.html", context)

如果使用的是类视图，重写get_context_data方法把staff_list加入返回的上下文字典中即可。

2. 模板层渲染单选表单 #

在对应的HTML模板中编写表单结构，循环遍历传递过来的员工列表渲染单选选项即可：

<form method="post">
    {% csrf_token %}
    <h4>选择对应员工</h4>
    {% for staff in staff_list %}
    <div>
        <input type="radio" id="staff_{{ staff.id }}" name="selected_staff" value="{{ staff.username }}" required>
        <label for="staff_{{ staff.id }}">{{ staff.get_full_name|default:staff.username }}</label>
    </div>
    {% endfor %}

    <div style="margin: 12px 0;">
        <label for="price">输入价格：</label>
        <input type="number" step="0.01" id="price" name="price" required>
    </div>

    <button type="submit">提交</button>
</form>

表单中name属性的值selected_staff和price就是提交后后台可以直接读取的参数名。

3. 视图层读取提交参数 #

表单提交后在视图中通过request.POST即可获取对应的入参：

def 你的视图函数名(request):
    staff = User.objects.filter(is_staff=True)
    if request.method == "POST":
        selected_staff = request.POST.get("selected_staff")
        input_price = request.POST.get("price")
        # 此处补充拿到参数后的业务逻辑即可
    
    context = {
        "staff_list": staff
    }
    return render(request, "你的前端模板文件名.html", context)

内容的提问来源于stack exchange，提问作者Toufiqur Rahman