上周,股份公司突然需要问卷调查功能,要的很着急。和一同事用了大约两天时间,将该功能完成。
项目情况是:要求在PC、微信端可以填写内容;微信端根据二维码打开问卷页面。
UI框架: bootstrap
效果如下:
代码如下:
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<head>
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<style type="text/css">
p{
font-size: 16px;
line-height:1.4;
}
.indent{text-indent: 2em;}
</style>
<title>中国XX股份有限公司2017年度企业风险评估调查问卷</title>
</head>
<body class="container">
<div class="panel panel-default" style="margin:30px 0;">
<div class="panel-body">
<div style="text-align:center;">
<img src="<%=basePath%>/page/pf/login/logo.png" />
<h4 class="page-header">中国XX股份有限公司<br>2017年度企业风险评估调查问卷</h4>
</div>
<spring:form id="defaultForm" οnsubmit="return check();" class="form-horizontal" modelAttribute="questionnaireDto" action="