附件上传后,为了展示页面更加友好,可添加附件类型图标来说明附件的类型。
下图为收集的常用文件类型图标。下载链接:FileType
程序员的工匠精神!
在项目开发中常常需要上传附件,并进行查看。本次项目中需要上传pdf文件并能够在线预览。
为了实现此需求,使用了PDF.js这一js库。
PDF.js文件目录结构
项目代码
其中file为PDF文件的路径,
PDF预览页面。图中红色框中分别为打印和下载。
项目开发中需要实现html页面的打印,经过对比,此次使用的是PHP的mPDF6.0类库。
mPDF打印、导出页面教程:
下图中使用的是ThinkPHP框架,需要将mPDF类库导入框架中第三方类库目录中,在项目中引入mPDF,设置对应参数,进行pdf输出。
formValidator是一款基于JQuery的表单验证插件。
jQuery formvalidator插件 API帮助文档
实际项目中,表单经常需要使用AJAX进行提交,如下:
在AJAX提交时没有先检验表单数据,即formValidator插件没有执行数据校验检查,直接提交到后台,出现前端数据校验未通过也能够提交的情况。
将表单提交事件代码改为如下形式,在提交前先判断当前页中表单是否已经通过formValidator的校验,通过则将数据提交后台,否则不提交。