在原有的表格中,添加行与列

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%

String path = request.getContextPath();

%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<html>

<head>

<script src="<%=path%>/resources/admin/js/jquery-1.8.3.min.js"></script>

<script type="text/javascript">

function show(obj,valu){

obj.innerHTML = "<input type='text' name='name' value='"+ valu +"'>";

}

 

</script>

</head>

<body>

<input type="button" value="添加等级" id="zjdj">

<input type="button" value="添加结构" id="zjjg">

<form action="<%=path%>/admin/courseGrade/save" method="post">

<table border="1px" width="800px" id="course">

<tr id="ss">

<td id="mm">

等级\结构

</td>

<c:forEach items="${courseStructureList}" var="courseStructure">

<td onDblClick="show(this,'${courseStructure.name}')" id="jg">

<input type="hidden" name="id" value="courseStructure.id">

<input type="hidden" name="name" value="${courseStructure.name}">

${courseStructure.name}

</td>

</c:forEach>

</tr>

 

 

<c:forEach items="${courseKnowledgeBlockList}"

var="courseKnowledgeBlock" varStatus="s1">

<tr>

 

<c:forEach items="${courseGradeList}" var="courseGrade"

varStatus="status">

 

<c:if test="${s1.index==status.index}">

 

<td onDblClick="show(this,'${courseGrade.name}')" id="dj">

<input type="hidden" name="id" value="courseGrade.id">

<input type="hidden" name="name" value="${courseGrade.name}">

${courseGrade.name}

</td>

 

</c:if>

</c:forEach>

<c:forEach items="${courseKnowledgeBlock}" var="zhishikuai">

<td onDblClick="show(this,'${zhishikuai.name}')" id="zhishikuai">

<input type="hidden" name="id" value="zhishikuai.id">

<input type="hidden" name="name" value="${zhishikuai.name}">

${zhishikuai.name}

</td>

 

</c:forEach>

</tr>

</c:forEach>

</table>

</form>

</body>

<script type="text/javascript">

$("#zjdj").click(function(){

$("#course tr:last").after('<tr></tr>');

for(var a=0;a<$("tr:eq(0) td").length;a++) {

$("tr:last").append("<td ><input type='text' size='10'></td>")

}

});

$("#zjjg").click(function(){

$("#course tr").append("<td><input type='text' size='10'></td>")

});

</script>

</html>

 

你可能感兴趣的:(表格)