fastapi: wtforms用fieldlist接收列表参数

一，代码：

html页面

function get_selected_id() {
    // 1. 获取你的 form 元素 (假设 form 的 id 是 'myForm')
    const form = document.getElementById('myForm');
    console.log("form:", form)
    // 2. 找到该 form 下所有选中的 checkbox
    const checkedBoxes = form.querySelectorAll('input[type="checkbox"][name="check-item"]:checked');

    console.log("checkedBoxes:", checkedBoxes)

    // 3. 将 NodeList 转换为数组，并提取 value
    const values = Array.from(checkedBoxes).map(checkbox => checkbox.value);

    console.log(values); // 输出类似: ["apple", "banana"]
    return values;
}


function set_disable(evt){
    var url = "{{ url_for('role_set_disable') }}";
    console.log("url:", url);

    var ids = get_selected_id();

    var formData = new FormData();
    ids.forEach(item => {
    console.log("one:", item)
    formData.append('ids', item);
});
    formData.append('evt', evt);


        //ajax提交数据
        $.ajax({
            url:url,
            type: "post",
            data: formData,
            contentType: false,
            processData: false,
            success: function(data){
                console.log('success');
                console.log('data.code:',data.code);
                if (data.code == 200){
                    phenix.show_success_note(data.message);
                    //跳转:
                    //刷新当前页面:
                    setTimeout(function() {
                       // 这里的代码会在1.5秒后执行
                       location.reload();
                    }, 1500);
                } else {
                    phenix.show_error_note("错误提示: " + data.message);
                }
                console.log('data:',data);
            },
            error: function(xhr, status, error) {
                console.error('保存失败');
                console.error(error); // 输出错误信息

                // 当 HTTP 状态码为 400, 401, 403, 404, 500 时，自动进这里
                console.log("HTTP 状态码:", xhr.status); // 例如 400 或 500

                // 关键点：即使是错误状态，后端返回的 JSON 依然在 xhr.responseText 中
                try {
                    var errResponse = JSON.parse(xhr.responseText);
                    phenix.show_error_note("错误提示: " + errResponse.message);
                } catch(e) {
                    alert("系统发生未知错误，请稍后再试");
                }
            }
        });

}

 

python:

# 做validator的form
class RoleSetDisableForm(WTForm):
    #id = IntegerField('page', [validators.NumberRange(min=1)], default=0)
    # ,validators=[DataRequired()], min_entries=1
    ids = FieldList(IntegerField("ids",validators=[NumberRange(min=1,message="每个数字最小不能小于 1")]),min_entries=1)
    evt = IntegerField('evt', [AnyOf(values=[0, 1], message="值必须是 0 或 1 之一！")],default=0)

    def validate_ids(self, field):
        # field.data 是一个列表，包含了所有提交上来的数据
        # 过滤掉 None 或空值，计算真正有效的条目数
        valid_entries = [v for v in field.data if v is not None]

        # 如果有效条目数小于 min_entries (这里是 1)
        if len(valid_entries) < 1:
            raise ValidationError("至少需要填写一项id！")  # 这里写你自定义的报错信息

@router.post("/set_disable",summary="角色禁用、启用")
async def role_set_disable(request: Request,response: Response,db: AsyncSession = Depends(get_db)):

    get_data = await request.form()
    print("get_data:", get_data)

    '''
    getform = RoleSetDisableForm(data=get_data)
    print(getform)
    print(getform.ids.data)
    '''

    # form_data_dict = MultiDict()
    res = {}
    ids = []
    evt = 0
    for key in get_data.keys():
        print("key:", key)
        # 用 .getlist(key) 把前端 append 的同名数组全部捞出来
        if key == 'ids':
            for value in get_data.getlist(key):
                print("value:", value)
                ids.append(int(value))
        if key == 'evt':
            evt = get_data.get(key)

    res["ids"] = ids
    res['evt'] = evt

    print("res:", res)

    # 3. 传入 formdata 参数（注意：这次是 formdata，不是 data）
    form = RoleSetDisableForm(data=res)


    if form.validate():
        print("valid")
        print("ids:", form.ids)
        print("ids2:", form.ids.data)

        try:

            for id in form.ids.data:
                print("id:", id)
                # 1. 查询用户是否存在
                stmt = select(Role).where(Role.id == id)
                result = await db.execute(stmt)
                role = result.scalars().first()
                if not role:
                    continue
                # 更新字段
                role.status = evt


            await db.commit()
            await db.refresh(role)

        except Exception as err:
            await db.rollback()
            stack = traceback.format_exc()
            logger.bind(log_type="system").info(f'注册用户失败: {err}')
            logger.bind(log_type="system").info(stack)
            return JSONResponse({"status_code": 400, "msg": '修改用户信息时出错', "data": {}})

        # return JSONResponse({"status_code": 200, "msg": "修改成功", "data": {}})
        return ApiResponse.success(response=response, message="修改成功")
    else:
        print("errors1:", form.errors)

        error_str = ''
        for field, errors in form.errors.items():
            print("field:", field)
            print("errors:", errors)
            error_msg = ''
            for error in errors:
                print("error:", error)
                if isinstance(error, list):
                    err_cont = error[0]
                else:
                    err_cont = error
                if error_msg == '':
                    error_msg = err_cont
                else:
                    error_msg += "," + err_cont

            if error_str == '':
                error_str = error_msg
            else:
                error_str += "," + error_msg
        # error_msg = "; ".join([f"{field}: {', '.join(errors)}" for field, errors in form.errors.items()])
        # return JSONResponse({"status_code": 400, "msg": error_str, "data": {}})
        return ApiResponse.fail(response=response,code=400,status_code=400,message=error_str)

 

二，测试效果：