dbms_primeidc/idcproject/WebContent/jsp/main/IdcJoinForm.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core" %>
<style>
.mylabel
{
	margin-top:5px;
}
</style>
<script type="text/javascript" src="IDC/js/setToken.js"></script>
<script type="text/javascript" src="IDC/js/SetPower.js"></script>
<script type="text/javascript" >

$(function()
{
	//$("#idc").val("회원가입");
	$(document).on("click","li > a ",function()
	{
		$("#member_id").val($(this).html());
		$("#idToggle").hide();
	});
	$(document).click(function()
	{
		$("#idToggle").hide();
	});
	$("#member_id").bind(
	{
		"input":function()
		{
			$.ajax(
			{	
				url : "IdcJsonID.jso",
				type : "post",
				data : "selectJson=1&data="+$(this).val(),
				dataType : "json",
				timeout : "30000",
				cache : false,
				
				success : function(data)
				{
					var idArr = data;
					$("#idToggle").empty();
					for(var i=0;i<idArr.length;i++)
					{
						var li = $("<li>");
						li.attr("role","presentation");
						var a = $("<a>");
						a.attr(
						{
							"href":"#",
							"role":"menuitem",
							"tabindex":"-1"
						});
						a.html(idArr[i].id);
						li.append(a);
						$("#idToggle").append(li);
					}
					
					$("#idToggle").show();
				},
				error : function(xhr, textStatus, errorThrown)
				{
					alert("실패");
				}
			});
		}
	});
});
</script>
<!-- 여기가 본 페이지이다 -->
<div class="row">
	<div class="col-lg-8">
		<div class="panel panel-default">
			<div class="panel-heading">
				<h4><i class="fa fa-desktop fa-fw"></i> 멤버 등록</h4>
			</div>
			<div class="panel-body">
				<div class="row">
					
				</div>
				<!-- row -->
				<form action="IdcJoin.main" method="post" class="form-inline" role="form">
		   			<input type="hidden" id="token" name="token">
		   			<div class="table-responsive">
						<table class="table table-hover">
							<thead>
							<tr>
								<td colspan="2" style="padding:0px;" align="center">
									<div class="well" style="margin:0px; padding:3px;" >
										<label style="margin-bottom:0px;"><h4>회원가입</h4></label>
									</div>
								</td>
							</tr>
							</thead>
							<tbody>
								<tr>
									<td> 
										<label>아이디</label>
									</td>
									<td>
										<div class="input-group">
											<input type="text" class="form-control" placeholder="아이디" name="member_id" id="member_id">
											<ul class="dropdown-menu" role="menu" id="idToggle">
											</ul>
										</div>
										<div >
											<label class="mylabel">사용자 ID는 3~20자 사이의 영문,숫자의 조합으로<br> 이루어져야 하며 영문으로 시작되어야 합니다 .</label>
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>비밀번호</label>
									</td>
									<td>
										<div>
											<input type="password" class="form-control" placeholder="비밀번호" name="pass">
										</div>
										<div >
											<label class="mylabel">비밀번호는 6~20자로 되어야 합니다.</label>
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>비밀번호 확인</label>
									</td>
									<td>
										<div>
											<input type="password" class="form-control" placeholder="비밀번호 확인" name="re_pass">
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>이름</label>
									</td>
									<td>
										<div>
											<input type="text" class="form-control" placeholder="이름" name="name">
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>사원번호</label>
									</td>
									<td>
										<div>
											<input type="text" class="form-control" placeholder="사원번호" name="num">
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>직급</label>
									</td>
									<td>
										<div>
											<input type="text" class="form-control" placeholder="직급" name="rank">
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>연락처</label>
									</td>
									<td>
										<div>
											<input type="text" class="form-control" placeholder="연락처" name="phone">
										</div>
									</td>
								</tr>
								<tr>
									<td> 
										<label>위치</label>
									</td>
									<td>
										<div>
											<select name="location">
												<option selected="selected" value="도쿄">도쿄</option>
												<option selected="selected" value="치바">치바</option>
											</select>
										</div>
									</td>
								</tr>
								<tr>
									<td>
										<label>시간</label>
									</td>
									<td>
										<select name="part">
											<option value="0">주간</option>
											<option value="1">중간</option>
											<option value="2">야간</option>
										</select>
									</td>
								</tr>
								<tr>
									<td>
										<label>권한</label>
									</td>
									<td id="pContent">
										<c:forEach begin="0" end="9" varStatus="i">
											${i.count }. <input type="checkbox" class="pCheck" name="power" value="${i.count }"
																data-toggle="popover-top"
																data-trigger="hover"
																data-content="권한설정 ${i.count} 입니다. }" 
																data-original-title="${i.count }권한">
										</c:forEach>
									</td>
								</tr>
								<tr>
									<td> 
										<label>기타 사항</label>
									</td>
									<td>
										<div>
											<textarea name="note" rows="5" cols="50" class="form-control"></textarea>
										</div>
									</td>
								</tr>
							</tbody>
							<tfoot>
							</tfoot>
						</table>
					</div>
					<!-- table-responsive -->
					<div class="input-group-btn">
							<input type="submit" class="btn btn-primary btn-outline" value="저장">
							<a href="DefaultPage.cli" class="btn btn-default btn-outline">취소</a>
					</div>
				</form>
			</div>
			<!-- panel-body -->
		</div>
		<!-- panel panel-default -->
	</div>
	<!-- col-lg-12 -->
</div>
<!-- row -->
<!-- /#page-wrapper -->