如何在Ajax验证中使用WTForms?

swdev

我习惯在烧瓶应用程序中通过Flask-WTF使用WTForms。执行服务器端验证很简单。但是,如何利用此服务器验证来进行字段级别,ajax,客户端验证?因此,当用户使用Tab键切换到其他输入字段时,我的应用程序可以直接对其进行验证并给出验证警告/信息/错误。

我尚未在互联网上找到资源

米格尔

可能的解决方案如下:

  • 在客户端,您将blur窗体的所有控件中的事件附加到处理程序

  • 每次模糊事件发生时,您都运行一个Javascript函数,该函数收集所有字段的值,然后将其作为ajax POST请求提交。

  • 在服务器上,处理此Ajax POST请求的view函数会实例化Flask-WTF表单,然后对其进行验证。验证产生的任何错误都将收集到字典中,然后以JSON响应的形式发送回客户端。

    例如,成功的验证可以返回以下JSON:

    { 
        "errors": {}
    }
    

    包含错误的响应可能是:

    {
        "errors": { 
            "name": "This field is required",
            "age": "Enter a numeric value between 0 and 99"
        }
    }
    
  • 客户端获取此JSON响应,并将所需的更改应用于DOM以暴露错误。

  • 如果在返回前一个模糊事件之前收到新的模糊事件,则可能要中止挂起的ajax POST,并使用更新的字段值启动一个新的模糊事件。一次只能有一个待处理的验证请求,以避免出现竞争情况。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章