【项目需求】
问卷调查的制作学生端已经完成了,下一步要做的便是后台对问卷结果的管理。通过和老师的沟通,了
解到老师想要的结果是按专业查询的结果,而其中包括两门课程。所以,接下来的工作便很明确了。
【项目设计】
对问卷结果的回收内容明确之后,第一项工作便是页面的设计。如下:
在导航栏新增对此次问卷调查的菜单,其下包括三个子菜单,也就是本次问卷包含的三种题型,分开查询。每个页面,通过课程与专业的选择,进行问卷结果的查询。
【项目开发】
本次项目开发的具体步骤不一一写下来了,思路是一致的。即前台页面通过已有的课程名和专业名去数
据库进行查询,查询的结果用的是DataTable盛放的,而前台能够接收到的数据类型应该是Json格式的,
最后在前台显示的还是Table。这么一说,好像很糊涂,那么就看看下面的一张图:
【代码实现】
下面,跟着上面的一条线,看看部分关键代码。
(1)D层,写的是一个根据课程名称和专业名称查询对应的问卷结果:
/// <summary> /// 根据专业课程查询单选结果——胡志婷——2016年1月8日09:32:03 /// </summary> /// <param name="courseName">课程信息</param> /// <param name="majorName">专业信息</param> /// <returns>DataTable</returns> public DataTable QuerySingleAnswerBymajorName(string courseName,string majorName) { //按对应的课程专业查询单选题下学生的选项及各个选项所选的人数 string sql = "select singleAnswer,singleChoiceContext,singleOptionContext,count(singleAnswer) as count from V_SingleAnswerInfo where majorName=@majorName and courseName=@courseName and singleAnswer=singleOptionID Group by singleAnswer,singleChoiceContext,singleOptionContext order by singleChoiceContext"; //参数,课程和专业信息 SqlParameter[] para=new SqlParameter[]{ new SqlParameter("@majorName",majorName.Trim()), new SqlParameter("@courseName",courseName.Trim()) }; //执行带参数查询的方法 DataTable dt =sqlHelper .ExecuteQuery(sql,para,CommandType.Text); //返回查询结果 return dt; }(2)B层,将D层查询到的结果返回。
/// <summary> /// 根据专业课程查询单选结果——胡志婷——2<span style="font-family: 楷体; widows: auto;">016年1月8日</span><span style="widows: auto; font-family: 楷体;">09:29:53</span> /// </summary> /// <param name="courseName">课程信息</param> /// <param name="majorName">专业信息</param> /// <returns>DataTable</returns> public DataTable QuerySingleAnswerBymajorName(string courseName, string majorName) { //声明表对象 DataTable dt = new DataTable(); //执行查询 dt = new SingleDAL().QuerySingleAnswerBymajorName(courseName, majorName); //返回结果 return dt; }(3)一般处理程序,将DataTable转换为Json字符串。
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; //问卷单选答案实体 SingleAnswerEntity singleanswerentity = new SingleAnswerEntity(); //课程信息 singleanswerentity.CourseName = context.Request.QueryString["courseName"].ToString(); //专业信息 singleanswerentity.MajorName=context.Request.QueryString["majorName"].ToString(); //根据专业课程查询单选信息答案方法 DataTable dtSingleAnswer = new StaticticalTeacherScoresBLL().QuerySingleAnswerBymajorName(singleanswerentity.CourseName, singleanswerentity.MajorName); //实例化DataTable与JSON间转换的业务逻辑类 DatatableAndJsonBLL datatableAndJsonBLL = new DatatableAndJsonBLL(); //调用DataTable转换为JSON方法 string strJSON = datatableAndJsonBLL.DataTable2Json(dtSingleAnswer); context.Response.Write(strJSON); }(4)DataTableAndJsonBLL业务逻辑层下的DataTableToJson方法。
/// <summary> /// 将DataTable数据转换为Json字符串——胡志婷——2016年1月6日14:29:10 /// </summary> /// <param name="dt">DataTable</param> /// <returns>JSON string</returns> public string DataTableToJson(DataTable dt) { //实例化一个可变的字符序列 StringBuilder jsonBuilder = new StringBuilder(); //开始给字符序列附加字符 jsonBuilder.Append("["); for (int i = 0; i < dt.Rows.Count; i++) { jsonBuilder.Append("{"); for (int j = 0; j < dt.Columns.Count; j++) { jsonBuilder.Append("\""); jsonBuilder.Append(dt.Columns[j].ColumnName); jsonBuilder.Append("\":\""); jsonBuilder.Append(dt.Rows[i][j].ToString()); jsonBuilder.Append("\","); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("},"); } jsonBuilder.Remove(jsonBuilder.Length - 1, 1); jsonBuilder.Append("]"); return jsonBuilder.ToString(); }(5)AJAX将接收到的JSON字符串进行处理
<script type="text/javascript"> //查询单选题答案——胡志婷——2016年1月8日09:49:55 function QuerySingleAnswer() { var courseName = document.getElementById("dropCourse").value; var majorName = document.getElementById("dropCollege").value; if (courseName == "" || majorName == "") { alert("请先选择信息!"); return null; } $.ajax({ type:"GET", //执行一般处理程序下的方法 url:"handler/QuerySingleAnswer.ashx?courseName=" + courseName + "&majorName=" + majorName, success: function (strJSON) { while (strJSON.indexOf("\r\n") >= 0) strJSON = strJSON.replace("\r\n", "\\r\\n"); //将JSON字符串转换为JSON对象 var obj = eval(strJSON); $("#suggestionTable tr").eq(1).removeClass("contentDisplay"); //移除模板行的样式 $("#suggestionTable tr").eq(1).nextAll().remove(); //将标题行的tr删除 这里指的是删除第二个tr //依次遍历获得的json数据,向数据表table中动态加载数据 for (var i = 0; i < obj.length; i++) { // clone() 方法生成被选元素的副本,包含子节点、文本和属性。 var row = $("#content").clone(); //单选题内容 row.find("#SingleFirst").text(obj[i].singleChoiceContext); row.find("#SingleSecond").text(obj[i].singleOptionContext); row.find("#SingleThird").text(obj[i].count); //将新行添加到建议表中 row.appendTo("#suggestionTable"); } //添加模板列的css样式 $("#suggestionTable tr").eq(1).addClass("contentDisplay"); }, //返回数据失败,弹出错误显示 error: function (XmlHttpRequest, textStatus, errorThrown) { alert(XmlHttpRequest.responseText); } }); return false; } </script>(6)最后,我们在前台就可以看到查询到的结果了。
【项目总结】
其实,
我们不仅仅可以将DataTable转换为JSON返回到前台,同样也可以将JSON转换
为DataTable存储到后台,在这里就不贴代码了。
一直以来,项目中的实现都是在已有的模板代码下进行实践的,所以对于代码的理解,对于思路的理解,自己并没有好好理会过。所处的状态好像是,虽然功能实现了,但具体的逻辑或者实现过程自己并没有做到心中有数吧。
通过这一次的维护实践,才让我接触到了DataTable与JSON之间的转换,这好像让自己恍然大悟,有时间可以把各种项目的代码都好好看看,对于代码的理解也是需要慢慢培养和积累的。