提交表单是非常多案例中都会使用到的一种功能,例如活动报名,提交审核,问卷调研等等。其实它要实现的最终结果就是将前台输入的数据提交到后台的数据库中,今天以这个极简活动报名为例说一下提交表单的具体做法和流程。

这个极简活动报名中提交的表单中包含Name、Telephone、Have dinner、Session和Self introduction五项,于是我们在数据库中添加对应的五个字段,其中Have dinner字段用数字1和0分别表示是和否。

服务中的五个接收参数则分别对应数据库的五个字段,我们将每个参数提交到数据库对应字段即可,提交完成数据库会返回此次提交是否成功,我们将其作为服务的返回结果。

1.组件
在前台我们要输入这五个提交项的具体值,Name、Telephone、Self introduction这三项使用输入框组件,用户直接输入即可。



点击confirm按钮,会先判断各个输入框的内容是否为空,还有内容类型是否正确,符合提交条件后会发送给提交报名动作组,不符合则对用户进行提示。


可以看到数据的传递流程是用户输入,然后依次传递到动作组、服务和数据库中,所以提交表单功能的关键就是动作组和服务的参数还有数据库的字段都做到相互对应。