form表单提交多文件附加数据-使用bootstrap-fileinput

时间:2024-03-22 19:54:15

使用到的插件有Bootstrap-validatorBootstrap-fileinput
为了做出美丽的页面我也呕心沥血研究了一下Bootstrap-fileinput
Bootstrap-fileinput 不设置Uploadurl就可以实现非ajax提交,把它当作一个普通的文件控件,如下图,我点击Submit按钮就能实现表单数据和文件的同时提交。
Bootstrap-fileinput下载地址:https://codeload.github.com/kartik-v/bootstrap-fileinput/zip/5.1.0
form表单提交多文件附加数据-使用bootstrap-fileinput
并且设置了表单验证。Bootstrap-validator的验证不成功会直接将submit按钮设置为不可用,符合条件之后才会恢复,
Bootstrap-Validator下载地址:https://codeload.github.com/nghuuphuoc/bootstrapvalidator/zip/master
form表单提交多文件附加数据-使用bootstrap-fileinput
form表单提交多文件附加数据-使用bootstrap-fileinput
有个问题就是国际化,但我使用的是两种语言,使用资源文件实现,而不是只设置一种语言就可以,所以最简单的方法就是修改这些提示信息,打开下载好的fileinput.js文件去找,默认的提示在下面这里。
form表单提交多文件附加数据-使用bootstrap-fileinput
在options里修改即可,
form表单提交多文件附加数据-使用bootstrap-fileinput
最后的效果是这样
form表单提交多文件附加数据-使用bootstrap-fileinput

提交

form表单提交多文件附加数据-使用bootstrap-fileinput

后台接收

接收就很简单啦!

最后想说一下自己最近的感悟,我们平时学习总是觉得知识都能看懂,教程也简单,但一到项目中就变得束手无策,所以让我明白在学习的时候一定要学以致用,学的时候就要知道什么时候会用到,不然学很多很多到最后也是徒劳。
现在搜索引擎代替了思考,唾手可得的信息让人忘记思考,这真的挺可怕的,我现在遇到一个问题第一件事是百度,从来不会思考应该怎么解决,而百度上的碎片化信息又难以应用到项目中,这让我耗费了太多时间,到头来收获寥寥无几。
emm而自己还是什么都不会,表面上是在拼命工作,熬夜学习,实际上全都耗费在无意义的博文上,还是继续熬吧!
最后再给自己鸡汤一句,一定要持续学习,人一旦停止学习就完蛋了,仅仅是为了适应生活而已。