jiangwt100
- 浏览: 36399 次
- 性别:
- 来自: 苏州
-
文章分类
最新评论
-
陌上君：
文章很好 ，记下了，多谢。上面那个不小心的留言删了吧
Flex4打印功能的实现 -
陌上君：
引用引用[u][i][b][flash[color=viole ...
Flex4打印功能的实现 -
Slardar_007：
sssssssssss
Flex4打印功能的实现 -
jiangwt100：
额，好吧，图挂掉了
Flex4皮肤制作 -
spirit1203：
可惜图都看不到..
Flex4皮肤制作
应用jquery,jquery-ui,jquery-validation,json写一个组卷页面（动态组卷ajax+springmvc）
本人也是jquery的新手，写得若有问题，请大家提出宝贵意见共同提高.
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/common/taglib.jsp"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style/manageStyle.css" rel="stylesheet" type="text/css" />
<link type="text/css" rel="stylesheet"
href="style/ui-base/jquery-ui.css" />
<style type="text/css">
body {
text-align: left;
}
.content {
width: 50%;
text-align: center;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
}
td {
padding: 7px;
}
form input {
font-size: 20px;
}
</style>
<script src="js/jquery.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/jquery.json-2.3.js"></script>
<script src="/${projectName}/studentExam/js/jquery.validate.min.js"></script>
<script language="javascript">
function removeProblem(problemId,type){
if(type==1)
$("'.simple"+problemId+"'").remove();
else if(type==2)
$("'.multi"+problemId+"'").remove();
else if(type==3)
$("'.notConfirm"+problemId+"'").remove();
else if(type==4)
$("'.choose"+problemId+"'").remove();
else if(type==5)
$("'.simpleSubject"+problemId+"'").remove();
else if(type==6)
$("'.communication"+problemId+"'").remove();
}
function toPage(current,tp){
$.post("/${projectName}/getPagedProblems.ajax",
{
type:tp,
currentPage:current
},
function(data){
var daohang = '';
var mydata = eval('('+data+')');
var info = '<tr><th>选择</th><th>题目名称</th><th>教材</th><th>章</th><th>节</th><th>详情</th></tr>';
$.each(mydata.list,function(index,entity) {
info += "<tr><td><input type=checkbox name='SelectedProblems"+tp+"' value='"+entity.problemId+"'/></td><td>"+entity.problemName+"</td><td>"+(entity.knowledgepoint==null?'nothing':entity.knowledgepoint.book.bookName)+"</td><td>"+(entity.knowledgepoint==null?'nothing':entity.knowledgepoint.chapter)+"</td><td>"+(entity.knowledgepoint==null?'nothing':entity.knowledgepoint.section)+"</td><td>详情</td></tr>";
});
daohang+="第"+mydata.currentPage+"页 ";
daohang+="共"+mydata.totalPage+"页 ";
if(mydata.currentPage==1){
daohang+="第一页 上一页 ";
}
else{
daohang+="<a href='javascript:toPage(1,"+tp+")'>第一页</a> ";
daohang+="<a href='javascript:toPage("+(mydata.currentPage-1)+","+tp+")'>上一页</a> ";
}
if(mydata.currentPage!=mydata.totalPage)
{
daohang+="<a href='javascript:toPage("+(mydata.currentPage+1)+","+tp+")'>下一页</a> ";
daohang+="<a href='javascript:toPage("+(mydata.totalPage)+","+tp+")'>最后一页</a>";
}
else{
daohang+="下一页 最后一页";
}
if(tp==1)
{
$("#singleTable").html(info);
$("#SingleDaoHang").html(daohang);
}
else if(tp==2)
{
$("#multiTable").html(info);
$("#MultiDaoHang").html(daohang);
}
else if(tp==3)
{
$("#notConfirmTable").html(info);
$("#NotConfirmDaoHang").html(daohang);
}
else if(tp==4)
{
$("#chooseTable").html(info);
$("#ChooseDaoHang").html(daohang);
}
else if(tp==5)
{
$("#simpleSubjectTable").html(info);
$("#SimpleSubjectDaoHang").html(daohang);
}
else if(tp==6)
{
$("#communicationTable").html(info);
$("#CommunicationDaoHang").html(daohang);
}
});
}
function paperItem(id,percent){
this.id = id;
this.percent = percent;
}
$(document).ready(function(){
$("#paperForm").validate();
$("#SingleDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加单选"
});
$("#MultiDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加多选"
});
$("#NotConfirmDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加不定项选择"
});
$("#ChooseDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加判断"
});
$("#SimpleSubjectDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加简答题"
});
$("#CommunicationDialog").dialog({
autoOpen: false,
height: 600,
width: 600,
modal: true,
title:"添加论述题"
});
$("#simpleAdd").click(function(){
$("input[name='SelectedProblems1']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='simple"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",1)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' width='50px' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' name='points' id='"+mydata.problemId+"'/></td></tr>";
info+="<tr class='simple"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"(答案:"+mydata.problemObjectAnswer+")</td></tr>";
$.each(mydata.selectedItems,function(index,entity){
info+="<tr class='simple"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+entity.selectedMark+"."+entity.selectedContent+"</td></tr>";
});
info+="<tr class='simple"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='simple"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#simpleTitle").after(info);
});
});
$("#SingleDialog").dialog("close");
});
$("#multiAdd").click(function(){
$("input[name='SelectedProblems2']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='multi"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",2)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' width='50px' name='points' id='"+mydata.problemId+"'/></td></tr>";
info+="<tr class='multi"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"(答案:"+mydata.problemObjectAnswer+")</td></tr>";
$.each(mydata.selectedItems,function(index,entity){
info+="<tr class='multi"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+entity.selectedMark+"."+entity.selectedContent+"</td></tr>";
});
info+="<tr class='multi"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='multi"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#multiTitle").after(info);
});
});
$("#MultiDialog").dialog("close");
});
$("#notConfirmAdd").click(function(){
$("input[name='SelectedProblems3']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='notConfirm"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",3)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' width='50px' name='points' id='"+mydata.problemId+"'/></td></tr>";
info+="<tr class='notConfirm"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"(答案:"+mydata.problemObjectAnswer+")</td></tr>";
$.each(mydata.selectedItems,function(index,entity){
info+="<tr class='notConfirm"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+entity.selectedMark+"."+entity.selectedContent+"</td></tr>";
});
info+="<tr class='notConfirm"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='notConfirm"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#notConfirmTitle").after(info);
});
});
$("#NotConfirmDialog").dialog("close");
});
$("#chooseAdd").click(function(){
$("input[name='SelectedProblems4']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='choose"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",4)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' width='50px' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' name='points' id='"+mydata.problemId+"'/></td></tr>";
info+="<tr class='choose"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"(答案:"+(mydata.problemTrue?'正确':'错误')+")</td></tr>";
info+="<tr class='choose"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='choose"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#chooseTitle").after(info);
});
});
$("#ChooseDialog").dialog("close");
});
$("#simpleSubjectAdd").click(function(){
$("input[name='SelectedProblems5']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='simpleSubject"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",5)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' width='50px' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' id='"+mydata.problemId+"' name='points'/></td></tr>";
info+="<tr class='simpleSubject"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"</td></tr>";
info+="<tr class='simpleSubject"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>(答案):"+mydata.problemSubjectAnswer+"</td></tr>";
info+="<tr class='simpleSubject"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='simpleSubject"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#simpleSubjectTitle").after(info);
});
});
$("#SimpleSubjectDialog").dialog("close");
});
$("#communicationAdd").click(function(){
$("input[name='SelectedProblems6']:checked").each(function(index) {
var problemId = $(this).val();
$.post("/${projectName}/getProblemById/"+problemId+".ajax",
null,
function(data){
var info = '';
var mydata = eval('('+data+')');
info+="<tr class='communication"+mydata.problemId+"'><td><button class='ui-state-default' onclick='javascript:removeProblem("+mydata.problemId+",6)'>移除</button>"+mydata.problemId+"</td><td>"+mydata.problemName+"</td><td>难度："+mydata.problemDifficulty+"</td><td>分值：<input type='text' width='50px' name='points' title='不能为空,且为数字' maxlength='2' class='inputpercent required number' id='"+mydata.problemId+"'/></td></tr>";
info+="<tr class='communication"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>"+mydata.problemContent+"</td></tr>";
info+="<tr class='communication"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>(答案):"+mydata.problemSubjectAnswer+"</td></tr>";
info+="<tr class='communication"+mydata.problemId+"'><td colspan='4'>教材："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.book.bookName)+" 章："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+" 节："+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.section)+"</td></tr>";
info+="<tr class='communication"+mydata.problemId+"'><td colspan='4' style='word-break:break-all'>知识点:"+(mydata.knowledgepoint==null?'':mydata.knowledgepoint.chapter)+"</td></tr>";
$("#communicationTitle").after(info);
});
});
$("#CommunicationDialog").dialog("close");
});
$("#addSingle").click(function(){
$("#SingleDialog").dialog("open");
toPage(1,1);
});
$("#addMulti").click(function(){
$("#MultiDialog").dialog("open");
toPage(1,2);
});
$("#addNotConfirm").click(function(){
$("#NotConfirmDialog").dialog("open");
toPage(1,3);
});
$("#addChoose").click(function(){
$("#ChooseDialog").dialog("open");
toPage(1,4);
});
$("#addSimpleSubject").click(function(){
$("#SimpleSubjectDialog").dialog("open");
toPage(1,5);
});
$("#addCommunication").click(function(){
$("#CommunicationDialog").dialog("open");
toPage(1,6);
});
$("#paperSubmit").click(function(){
var arrayObject = new Array();
$("input[name='points']").each(function(index){
var pi = new paperItem($(this).attr('id'),$(this).val());
arrayObject.push(pi);
});
var jsonObject = $.toJSON(arrayObject);
$("#jsonObject").attr('value',jsonObject);
$("#paperForm").submit();
});
});
</script>
<title>组织试卷</title>
</head>
<body>
<h1>
组织试卷
</h1>
<form id="paperForm" action="/${projectName}/groupPaper.make?method=group" method="post">
<div>
试卷名称：
<input type="text" name="papername" title="不能为空" class="required" maxlength="30"/>
<br/>
试卷难度：
<input type="text" name="paperdifficult" title="请输入一位数字" class="required number" maxlength="1"/>
<br/>
考试时长：
<input type="text" name="paperlimitedtime" title="请输入5位以下数字" class="required number" maxlength="5"/>
<br/>
<br/>
</div>
<div id="addProblems">
<button class="ui-state-default" id="addSingle">
添加单选题
</button>
<button class="ui-state-default" id="addMulti">
添加多选题
</button>
<button class="ui-state-default" id="addNotConfirm">
添加不定项选择题
</button>
<button class="ui-state-default" id="addChoose">
添加判断题
</button>
<button class="ui-state-default" id="addSimpleSubject">
添加简答题
</button>
<button class="ui-state-default" id="addCommunication">
添加论述题
</button>
<br /><br/>
</div>
<div id="content" align="center">
<table width="100%">
<tr id="simpleTitle">
<th colspan="4">
一、单选题
</th>
</tr>
<tr id="multiTitle">
<th colspan="4">
二、多选题
</th>
</tr>
<tr id="notConfirmTitle">
<th colspan="4">
三、不定项选择题
</th>
</tr>
<tr id="chooseTitle">
<th colspan="4">
四、判断题
</th>
</tr>
<tr id="simpleSubjectTitle">
<th colspan="4">
五、简答题
</th>
</tr>
<tr id="communicationTitle">
<th colspan="4">
六、论述题
</th>
</tr>
</table>
<input type="hidden" id="jsonObject" name="jsonString"/>
<button class="ui-state-default" id="paperSubmit">提交</button>
</div>
</form>
<div id="SingleDialog" style="display: none;">
<table width="100%" id="singleTable">
</table>
<div id="SingleDaoHang"></div>
<button class="ui-state-default" id="simpleAdd">
添加
</button>
</div>
<div id="MultiDialog" style="display: none;">
<table width="100%" id="multiTable"></table>
<div id="MultiDaoHang"></div>
<button class="ui-state-default" id="multiAdd">
添加
</button>
</div>
<div id="NotConfirmDialog" style="display: none;">
<table width="100%" id="notConfirmTable"></table>
<div id="NotConfirmDaoHang"></div>
<button class="ui-state-default" id="notConfirmAdd">
添加
</button>
</div>
<div id="ChooseDialog" style="display: none;">
<table width="100%" id="chooseTable"></table>
<div id="ChooseDaoHang"></div>
<button class="ui-state-default" id="chooseAdd">
添加
</button>
</div>
<div id="SimpleSubjectDialog" style="display: none;">
<table width="100%" id="simpleSubjectTable"></table>
<div id="SimpleSubjectDaoHang"></div>
<button class="ui-state-default" id="simpleSubjectAdd">
添加
</button>
</div>
<div id="CommunicationDialog" style="display: none;">
<table width="100%" id="communicationTable"></table>
<div id="CommunicationDaoHang"></div>
<button class="ui-state-default" id="communicationAdd">
添加
</button>
</div>
</body>
</html>
0
顶
顶
2
踩
踩
分享到：
评论
2 楼
jiangwt100
2011-11-12
287854442 写道
1.没有图
2.没有在线demo
3.没有使用代码格式
....
2.没有在线demo
3.没有使用代码格式
....
在线demo不好弄啊!
1 楼
287854442
2011-11-12
1.没有图
2.没有在线demo
3.没有使用代码格式
....
2.没有在线demo
3.没有使用代码格式
....
发表评论
相关推荐
jquery validation jquery ui validation Engine验证插件
jquery-validation-1.8.0.rar jquery-validation-1.8.0.rar
jquery-validation-1.9.0，内有详细示例demo
jquery-validation-1.8.0.zip jquery-validation-1.8.0.zip jquery-validation-1.8.0.zip
jQuery-Validation-Engine-master非常好的jquery验证表单控件
jQuery-validation 1.14.0 官方版(2015.09.13--源代码+示例) 输入格式判别，条件输入识别，验证通过
jquery-validation-1.15.0
jquery-validation-1.8.1里面有很多例子
jQuery 验证插件 jquery-validation-1.11.1
前端表单验证插件 基于jQuery
jquery-validation.校验框架，没有积分的同学可以在我的博客下留言获取。
jQuery Validate 插件为表单提供了强大的验证功能，让客户端表单验证变得更简单，同时提供了大量的定制选项，满足应用程序各种需求。
jquery-validation-1.19.1的jq验证代码压缩包，便捷开发web中jq的文本框文本验证代码，上传新版本，供大家下载
jquery1.4.js jquery-validation.min.js 里面包括这两给个js包 都是最小版的
前端项目-jquery-validation-unobtrusive,添加到jquery validation，以在data-*属性中启用不显眼的验证选项。
该插件捆绑了一套有用的验证方法，包括 URL 和电子邮件验证，同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息，且已翻译成其他 37 种语言。 该插件是由 Jörn Zaefferer 编写...
jquery-validation-1.10.0 Jquery 验证插件 附带Demo 2012-12-25 最新
jquery-validation-1.9.0是一款优秀的form表单验证插件，此资源主要为某篇博客服务，如有需要还请下载。整个压缩包无法上传，有需要请留言
jquery-validation-1.19.1验证的最新版，jquery-validation-1.19.1.zip
jquery-validation-1.13.1