JSP页面dialog弹出层

标签：自定义dialog弹出层

1.脚本代码

    function showCreate(){
    	$('#createDialog').dialog({
    			title : '新增客户经理'
   			},{
   				height : 580
		  	},{
				width : 780
			},{
				resizable : true
			},{
				modal : true
			},{
				show : 'clip'
			}
		);
    }

	<input type="button" class="createBtn" onclick="showCreate();" value="新增" />

3.需要在dialog中显示的div 默认设置为display:none;

<div class="formPanel" id="createDialog" style="display:none;">
		<form id="saveCusmanagerAjax" action="${ctx}/bns/loanAjax/LoanCusmanager/save.do" method="post">
		<div class="formPanelBody">
			<table class="formTable" cellpadding="0" cellspacing="0">
   				<tr>
					<td class="tdLabel">
						<span class="required"></span>省份编号:
					</td>
					<td  >
						<input value="" id="provinceNo" name="provinceNo"    />
					</td>
					<td class="tdLabel">
						<span class="required"></span>省份名称:
					</td>
					<td  >
						<input value=" " id="province" name="province"    />
					</td>
				</tr>
				<tr>
					<td class="tdLabel">
						<span class="required"></span>市区编号:
					</td>
					<td  >
						<input value=" " id="cityNo" name="cityNo"    />
					</td>
					<td class="tdLabel">
						<span class="required"></span>市区名称:
					</td>
					<td  >
						<input value=" " id="city" name="city"    />
					</td>
				</tr>
				<tr>
					<td class="tdLabel">
						<span class="required"></span>部门编号:
					</td>
					<td  >
						<input value=" " id="deptNo" name="deptNo"    />
					</td>
					<td class="tdLabel">
						<span class="required"></span>部门名称:
					</td>
					<td  >
						<input value=" " id="dept" name="dept"    />
					</td>
				</tr>
				<tr>
					<td class="tdLabel">
						<span class="required"></span>团队编号:
					</td>
					<td  >
						<input value=" " id="teamNo" name="teamNo"    />
					</td>
					<td class="tdLabel">
						<span class="required"></span>团队名称:
					</td>
					<td  >
						<input value=" " id="team" name="team"    />
					</td>
				</tr>
				<tr>
					<td class="tdLabel">
						<span class="required"></span>经理编号:
					</td>
					<td  >
						<input value=" " id="managerNo" name="managerNo"  />
					</td>
					<td class="tdLabel">
						<span class="required"></span>经理姓名:
					</td>
					<td  >
						<input value=" " id="manager" name="manager"    />
					</td>
				</tr>
				<tr>
					<td class="tdLabel">
						<span class="required"></span>是否启用:
					</td>
					<td colspan="3" >
						<input value=" " id="isused" name="isused"    />
					</td>
				</tr>
   			</table>
    	</div>
    	<div class="formPanelFoot">
    		<table cellpadding="0" cellspacing="0">
    			<tr>
    				<td>
    					<input id="submitButton" onclick="saveCusmanagerByAjax();" type="button" value="提交" />
    					<input type="button" value="后退" onclick="history.back();" />
    				</td>
    			</tr>
    		</table>
    	</div>
		</form>
    </div>

4.关闭dialog的脚本代码:

    function closeDialog(){
		$('.dialog').dialog('close');
	}  

5.

JSP页面dialog弹出层

标签：自定义dialog弹出层

原文地址：http://blog.csdn.net/zhiyonghafu/article/details/44775219