<!DOCTYPEhtml>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title></title>
<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<scripttype="text/javascript">
Array.prototype.filterRepeat=function(){
varres=[],hash={};
for(vari=0,elem;(elem=this[i])!=null;i++){
if(!hash[elem]){
res.push(elem);
hash[elem]=true;
}
}
returnres;
}
$(function(){
varjson=[
{"SysName":"数据库","SysGuid":"1","CourseName":"SQL","CourseGuid":"22","Remarks":"大sb","firstdate":"2013-1-1","firstresult":"合格","secdate":"2013-2-1","secresult":"合格","thirddate":"2013-3-1","thirdresult":"合格"},
{"SysName":"数据库","SysGuid":"1","CourseName":"MySQL","CourseGuid":"23","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"不合格","secdate":"2013-2-1","secresult":"不合格","thirddate":"2013-3-1","thirdresult":"合格"},
{"SysName":"数据库","SysGuid":"1","CourseName":"NoSQL","CourseGuid":"24","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"不合格","secdate":"2013-2-1","secresult":"合格","thirddate":"2013-3-1","thirdresult":"合格"},
{"SysName":"数据库","SysGuid":"1","CourseName":"Oracle","CourseGuid":"25","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"不合格","secdate":"2013-2-1","secresult":"合格","thirddate":"2013-3-1","thirdresult":"合格"},
{"SysName":"ASP.NET","SysGuid":"2","CourseName":"基础","CourseGuid":"43","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"合格","secdate":"2013-2-1","secresult":"不合格","thirddate":"2013-3-1","thirdresult":"合格"},
{"SysName":"ASP.NET","SysGuid":"2","CourseName":"高级","CourseGuid":"44","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"合格","secdate":"2013-2-1","secresult":"不合格","thirddate":"2013-4-1","thirdresult":"合格"},
{"SysName":"JavaScript","SysGuid":"3","CourseName":"基础","CourseGuid":"54","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"合格","secdate":"2013-2-1","secresult":"合格","thirddate":"2013-5-1","thirdresult":"合格"},
{"SysName":"JavaScript","SysGuid":"3","CourseName":"高级","CourseGuid":"67","Remarks":"IQ太低","firstdate":"2013-1-1","firstresult":"不合格","secdate":"2013-2-1","secresult":"合格","thirddate":"2013-6-1","thirdresult":"合格"},
];
createTable(json);
$("#btnsave").click(function(){
$("#ta").text(setDataXML());
});
});
functioncreateTable(json){
vartb=$("#tb");
varsys=newArray;
for(vari=0;i<json.length;i++){
sys.push(json[i].SysName);
}
//过滤重复
sys=sys.filterRepeat();
vartr=null;
for(varj=0;j<sys.length;j++){
tr+="<trstyle='text-align:left'class=gridborderid=p"+j+"><tdcolspan=8>[-]"+sys[j]+"</td></tr>";
for(vari=0;i<json.length;i++){
if(json[i].SysName==sys[j]){
tr+="<trparent=p"+j+"style='text-align:center'pguid='"+json[i].SysGuid+"'cguid='"+json[i].CourseGuid+"'><td>"+json[i].CourseName+"</td><td>"+setDate(json[i].firstdate)+"</td><td>"+setSelect(json[i].firstresult)+"</td><td>"+setDate(json[i].secdate)+"</td><td>"+setSelect(json[i].secresult)+"</td><td>"+setDate(json[i].thirddate)+"</td><td>"+setSelect(json[i].thirdresult)+"</td><td>"+setInput(json[i].Remarks)+"</td></tr>"
}
}
}
tb.append(tr);
//设置行点击事件
$("tr.gridborder").css("cursor","pointer")
.toggle(function(){
vartxt=$(this).children().text();
$(this).children().text(txt.replace("-","+"));
},function(){
vartxt=$(this).children().text();
$(this).children().text(txt.replace("+","-"));
}).click(function(){
varid=$(this).attr("id");
$(this).siblings("tr[parent='"+id+"']").toggle();
});
//设置选中变色
$("tr[parent^=p]").toggle(function(){
$(this).attr('bgcolor','#E3e4e5');
},function(){
$(this).attr('bgcolor','#ffffff');
});
}
functionsetSelect(obj){
return"<selectstyle='width:96%'><optionvalue='"+obj+"'>"+obj+"</option><optionvalue='合格'>合格</option><optionvalue='不合格'>不合格</option></select>";
}
functionsetDate(obj){
return"<inputstyle='width:96%'type='text'value='"+obj+"'/>";
}
functionsetInput(obj){
return"<inputstyle='width:96%'type='text'value='"+obj+"'/>";
}
functionsetDataXML(){
vardataxml=$("<DataXML></DataXML>");
$("tr[parent^=p]").each(function(){
varitem=$("<Course/>");
varsysguid=$(this).attr("pguid");
varcguid=$(this).attr("cguid");
varfdate=$(this).children().children().eq(0).val();
varfresult=$(this).children().children().eq(1).val();
varsdate=$(this).children().children().eq(2).val();
varsresult=$(this).children().children().eq(3).val();
vartdate=$(this).children().children().eq(4).val();
vartresult=$(this).children().children().eq(5).val();
varremark=$(this).children().children().eq(6).val();
item.attr("SysGuid",sysguid).attr("Remarks",remark).attr("CourseGUID",cguid)
.attr("FirstDate",fdate).attr("FirstResult",fresult)
.attr("SecDate",sdate).attr("SecResult",sresult)
.attr("ThirdDate",tdate).attr("ThirdResult",tresult);
dataxml.append(item);
});
returndataxml[0].outerHTML;
}
</script>
</head>
<body>
<formid="form1"runat="server">
<div>
<tableid="tb"border="1"style="border-collapse:collapse"width="100%">
<tbody>
<trstyle="text-align:center">
<tdstyle="width:100px">课程名称</td>
<tdstyle="width:120px">初考时间</td>
<tdstyle="width:120px">初考成绩</td>
<tdstyle="width:120px">次考时间</td>
<tdstyle="width:120px">次考成绩</td>
<tdstyle="width:120px">清考时间</td>
<tdstyle="width:120px">清考成绩</td>
<tdstyle="width:250px">备注</td>
</tr>
</tbody>
</table>
</div>
<inputid="btnsave"type="button"value="保存"/>
<textareaid="ta"cols="100"rows="20"></textarea>
</form>
</body>
</html>
