bootstrap弹出框进行新增事件

1.页面弹出框代码

	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
		<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="myModalLabel">新增部门</h4>
				</div>
				<div class="modal-body">
					<form id="inputDepartmentForm" action="${ctx}/employeeDepartment/save" method="post" class="form-horizontal">
						<div class="form-group">
							<div class="control-group">
								<label for="deptNumber" class="control-label">部门编号：</label>
								<div class="controls">
									<input id="deptNumber" name="deptNumber" type="text" maxlength="2" class="required deptNumber" placeholder="部门编号"/>
									<span class="help-inline"><font color="red">*</font> </span>
								</div>
							</div>
						</div>
						<div class="form-group">
							<div class="control-group">
								<label for="deptName" class="control-label">部门名称：</label>
								<div class="controls">
									<input id="deptName" name="deptName" type="text" maxlength="10" class="required deptName" placeholder="部门名称"/>
									<span class="help-inline"><font color="red">*</font> </span>
								</div>
							</div>
						</div>
						<div class="form-actions">
							<div class="my-btn">
								<input id="btnDepartmentSubmit" class="btn btn-primary" type="button" value="保 存"/><i class="icon-ok bigger-110"></i>&nbsp;
							</div>
							<div class="my-btn">
								<input id="btnDepartmentRemove" class="btn btn-default" type="button" value="关 闭" data-dismiss="modal"/><i class="icon-undo bigger-110"></i>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>

弹出框样式如下

2.通过鼠标点击事件，弹出对话框

$("#btnAdd").click(function(){
	$('#myModal').modal();
});

3.点击保存按钮提交对话框数据

$("#btnDepartmentSubmit").click(function(){
	var employee = $("#inputForm").serialize();
	var deptName = $("#deptName").val();
	var deptNumber = $("#deptNumber").val();
	var name = $(".name").val();
	window.location.href = "${ctx}/employeeDepartment/save?employee=" + employee +"&deptName=" +deptName + "&deptNumber=" + deptNumber + "&name=" + name;
});

4.点击关闭按钮消除弹出框

$("#btnDepartmentRemove").click(function(){
	$("#deptNumber").val("");
	$("#deptName").val("");
});