前一段时间,项目经理让我为系统做一个问卷调查,看一下用户对系统的反应如何!
要求:
1、用户进去的时候,会弹出一个问卷调查页面。
2、弹出的页面不能被浏览器屏蔽掉
3、用户的问卷调查信息要保存的数据库中。
我的实施步骤:
1、用PowerDesigner设计了一下数据如下图:
2、用PowerDesigner生成数据的SQL,创建所需的数据库。
3、用CodeSmith生成问卷调查的后台页面
4、编写问卷调查页面
主要是用到Repeater控件和CheckBoxlist、RadioBoxlist控件
Repeater用来显示问题,其模板列嵌套CheckBoxlist、RadioBoxlist实现单选和多选的选项
5、如何在系统里面添加这个页面:
a:用模态窗口实现
function init() { var va= window.showModalDialog("Survey.aspx?s_id=1","","dialogWidth=200px;dialogHeight=100px;"); } window.οnlοad=init;
刚开始我就是这样做的,但是这样有一个弊端,可以被浏览器屏蔽掉。所以项目经理死活不同意,偶只好换个思路在登录页面浮一个div,里面显示问卷调查。
b.在页面里上浮div
最近一直在学习Mootools,于是就去Mootools官网搜了一个FloatBox,页面还挺漂亮的。于是采用Mootools+FloatBox。
<script type='text/javascript' src="mootools-core-1.3.js" ></script> <script type='text/javascript' src="Asset.js" ></script> <script type='text/javascript' src="FloatBox.js"> </script> <script type='text/javascript'> function init() { var Result; //获取用户是否参加过调查 var myRequest= new Request({ url: 'AjaxGetParameters.aspx?flag=1&u_id=kela', method: 'get', async:false, onRequest: function() { Result = 'loading...'; }, onSuccess: function(responseText) { Result = responseText; }, onFailure: function() { Result = 'Sorry, your request failed :('; } }); if(Result=='False') { new FloatBox.IFrame('Survey.aspx?s_id=1', { size: { x: 500, y: 400 }, rtl: true }); } } window.οnlοad=init;
6、效果类似于下图: