BootStrap模态框内容随信息动态加载

BootStrap模态框内容随信息动态加载

• 模态框显示
• 下面代码是显示一个模态框（我用的时候，把下面代码包含在了Java代码内，循环调用，所以需要点击详情时出现的信息有对应。）

<div class="btn btn-group">
	<a href="#">
		<button class="btn btn-info" type="button" data-toggle="modal" data-target="#ModifyProjectModal" onclick="mproject('<%=p.getId()%>','<%=p.getName()%>')">详情</button>
	</a>
	<form action="ModifyProjectServlet?id=${id }" id="mprojectform" method="post">
		<div class="modal fade" id="ModifyProjectModal" tabindex="-1" role="dialog" aria-labelledby="ModifyProjectModalLabel">
			<div class="modal-dialog" role="document">
 				<div class="modal-content">
   					<div class="modal-header">
     					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     					<h4 class="modal-title" id="ModifyProjectModalLabel">详情</h4>
   					</div>
   						
   					<div class="modal-body">
       					课程号：<input type="text" id="modifypid" name="modifypid" autocomplete="off" readonly>
      					课程名：<input type="text" id="modifypname" name="modifypname" autocomplete="off">
  					</div>
  						 	
   					<div class="modal-footer">					
          				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
          				<button type="submit" class="btn btn-primary">修改</button> 
   					</div>
 				</div>
			</div>
		</div>
	</form>	
</div>

js实现数据动态加载

<script>
	function mproject(mpid,mpname) {
			$("#modifypid").val(mpid);
			$("#modifypname").val(mpname);
		}
</script>

• 注意这里要对应详情按钮部分，其他部分script没有贴出来，跳转的Servlet也注意更改。
• 详情按钮部分的传参，是Java代码，截图部分如下