第一个前台页面----xflow的页面

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="ispr"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<ispr:page title="">
<jsp:attribute name="resources">
<ispr:i18n bundle="xflow"></ispr:i18n>
<script type="text/javascript">
var ctx = "${pageContext.request.contextPath}";
</script>
<style>
html body {
height: 100%;
width: 100%;
padding-top: 5px;
font-size: 12px;
line-height: 16px;
font-family: "Arial", "宋体", "Tahoma", "Verdana", "SimSun";
color: #000;
min-width: 900px;
overflow: hidden;
}

.errorMsg_leon {
background: center no-repeat white;
background-position: 5px 50%;
text-align: left;
padding: 2px 20px 2px 25px;
border: 1px solid #F9CBCB;
display: none;
width: 230px;
margin-left: 0px;
position: fixed;
border-radius: 4px;
font-family: Arail;
font-size: 12px;
font-family: color:"#E03689";
}
</style>
<ispr:link folder="/css/momgt" resources="validate_inspur.css" />
<ispr:link folder="/lib/searchField/css" resources="searchField.css" />
<ispr:link folder="/js/xflow" resources="appMapping.js" />
<script type="text/javascript"
src="${pageContext.request.contextPath}/lib/jquery.json-2.4.js"></script>
<script type="text/javascript"
src="${pageContext.request.contextPath}/lib/jquery.form.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/xflow/appMapping_import_result.js"></script>
</jsp:attribute>
<jsp:body>
<div id="center-panel">
<div class="m_tit_operate">
<span class="pr20"><a id="createAppMappingBtn"></a></span>
<span class="pr20"><a id="modifyAppMappingBtn"></a></span>
<span class="pr20"><a id="deleteAppMappingBtn"></a></span>
<span class="pr20"><a id="importAppMappingBtn"></a></span>
<span class="pr20"><a id="exportAppMappingBtn"></a></span>
<span class="pr20"><a id="downloadAppMappingBtn"></a></span>
<span id="rightArea" style="float: right;">
<input value=" " id="search" name="search"></input>
</span>
<div style="clear: both"></div>
</div>
<div id="appMappingGrid_container">
<table id="appMappingGrid"></table>
</div>
</div>

<%-- import and export --%>
<div id="import-window" style="display: none;">
<form id="importForm" name="importForm"
action="${pageContext.request.contextPath}/xflow/importAppMappingXFlow.do"
method="post" enctype="multipart/form-data">
<table id="information" cellspacing="15">
<tr>
<td><label><spring:message
code="xflow.importbtn.template" />:</label></td>
<td><a id='templatehref' href='#'><spring:message
code="xflow.importbtn.filenametemplate" /></a></td>
</tr>
<tr>
<td><label> <spring:message code="xflow.exportbtn.excelFileType" />:</label></td>
<td><label></label>
<input type="file" name="appMappingfileupload"
id="appMappingfileupload" class="fileuploadWidth"
style="position: absolute; filter: alpha(opacity = 0);opacity:0; width: 202px; height: 25px;"
onChange="document.importForm.importpath.value=this.value"
hidefocus="hidefocus" />
<span class="errorMsg_leon"></span>
<input id="importpath" name="importpath"
readonly="readonly" />
<input type="button" value="Browse"
onclick="document.expRuleImpForm.rulefileupload.click()" />
</td>
</tr>
</table>
<div id="import_btn_container" class="bottomBtnBar">
<div id="operateImportBtn" align="center">
<span class="pr10"><input id="importBtn" class="save"
type="submit" /></span>
<span class="pr10"><input id="importCancelBtn"
class="cancel" /></span>
</div>
</div>
</form>
</div>

<div id="import-result" style="display: none;">
<div id="resultContainer">
<table id="resultGrid"></table>
</div>

</div>
<div id="appMapping_export_window" style="display: none;">
<form id="exportForm" name="exportForm"
action="${pageContext.request.contextPath}/xflow/downloadXFlow.do"
method="post" enctype="multipart/form-data">
<div id="excelTypeDiv"
style="margin-left: 20px; margin-top: 20px;float:center;">
<label><spring:message code="xflow.exportbtn.excelFileType" />:</label>
<input id="excelTypeCombo" name="excelTypeCombo"
style="width: 120px; margin-left: 5px;" readOnly>
</div>
<div id="export_btn_container" class="bottomBtnBar" style="margin-top:20px;">
<div id="operateExportBtn" align="center">
<span class="pr10"><input id="exportBtn" class="save" /></span>
<span class="pr10"><input id="exportCancelBtn"
class="cancel" /></span>
</div>
</div>

</form>
</div>
<%-- import and export end --%>

<div id="dialog-form" style="display: none">
<form id="create_form" name="create_form">
<table id="appmapping_table" cellspacing="10">
<tr>
<td><label><spring:message code="xflow.create.port" />:</label></td>
<td>
<input name="port" id="port" class="editStyle" />
<span class="errorMsg_leon"></span><label class="redflag"
style="color: red">*</label>
</td>
<td><label><spring:message code="xflow.create.transportLayerProtocol" />:</label>
<div id="TLPList"></div>
</td>
<td>
<%-- <select id="TLPType" name="TLPType"></select> --%>
<input name="TLPType" id="TLPType" class="editStyle" />
<span class="errorMsg_leon"></span>
<label class="redflag" style="color: red">*</label>
</td>
</tr>

<%-- second row --%>
<tr>
<td>
<div id="IPAddressType" class="item">
<label class="text">
<spring:message code="xflow.IPaddress" /> :</label>
</div>
</td>
<td colspan="3">
<div id="IPRadio">
<input type="radio" id="IPType1" name="IPType" value="1"
checked="checked" style="heigh: 23px; border: 0px;">
<spring:message code="xflow.IPAddress.all" />
<input type="radio" id="IPType2" name="IPType" value="2"
style="margin-left: 30px; heigh: 23px; border: 0px;">
<spring:message code="xflow.IPAddress.IPv4" />
<input type="radio" id="IPType3" name="IPType" value="3"
style="margin-left: 30px; heigh: 23px; border: 0px;">
<spring:message code="xflow.IPAddress.IPv6" />
</div>
</td>
</tr>
<%-- ALL IP --%>
<tr id="IPAddressAll" style="display: none">
<td>
<span id="ALLIP" class="item">
<label class="text">
<spring:message code="xflow.IPAddress.all" /> :</label>
</span>
</td>
<td colspan="3">
<input type="text" id="ALLIP" name="ALLIP"
style="height: 20px; width: 500px;" value="0.0.0.0">
<span class="errorMsg_leon"></span><span
style="padding-left: 2px;"><font color="red">*</font></span>
</td>
</tr>

<tr id="IPAddressv4" style="display: none">
<td>
<span id="IPv4" class="item">
<label class="text">
<spring:message code="xflow.IPAddress.IPv4" /> :</label>
</span>
</td>
<td colspan="3">
<table>
<tr>
<td>
<input type="text" id="IPv41" name="IPv41" style="height: 20px; width: 100px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">.</span>
</td>
<td>
<input type="text" id="IPv42" name="IPv42" style="height: 20px; width: 100px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">.</span>
</td>
<td>
<input type="text" id="IPv43" name="IPv43" style="height: 20px; width: 100px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">.</span>
</td>
<td>
<input type="text" id="IPv44" name="IPv44" style="height: 20px; width: 100px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;"><font color="red">*</font></span>
</td>
</tr>
</table>

</td>
</tr>

<tr id="IPAddressv6" style="display: none">
<td>
<span id="IPv6" class="item">
<label class="text">
<spring:message code="xflow.IPAddress.IPv6" /> :</label>
</span>
</td>
<td colspan="3">
<table>
<tr>
<td>
<input type="text" id="IPv61" name="IPv61"style="height: 20px; width: 45px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv62" name="IPv62" style="height: 20px; width: 45px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv63" name="IPv63" style="height: 20px; width: 45px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv64" name="IPv64" style="height: 20px; width: 45px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv65" name="IPv65" style="height: 20px; width: 45px;" />
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv66" name="IPv66" style="height: 20px; width: 45px;" />
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv67" name="IPv67" style="height: 20px; width: 45px;" />
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;">:</span>
</td>
<td>
<input type="text" id="IPv68" name="IPv68" style="height: 20px; width: 45px;">
<span class="errorMsg_leon"></span>
<span style="padding-left: 2px;"><font color="red">*</font></span>
</td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</td>
</tr>
<%-- third row --%>

<tr>
<td><label><spring:message code="xflow.appName" /> :</label></td>
<td colspan="3">
<input type="text" id="appName" name="appName"
style="height: 20px; width: 500px;">
<span class="errorMsg_leon"></span><span
style="padding-left: 2px;"><font color="red">*</font></span>
</td>
</tr>

<%-- fourth row --%>
<tr>
<td><label><spring:message code="xflow.description" /> :</label></td>
<td colspan="3">
<textarea name="description" id="description" cols="80"
rows="3"> </textarea>
<span class="errorMsg_leon"></span>
</td>
</tr>
</table>
<%-- button --%>

<div id="operate-buttons" class="bottomBtnBar"
style="text-align: center; margin-top: 40px">
<span class="pr10"><input
type="button" id="save" class='save' /></span>
<span class="pr10"><input
type="button" id="cancel" class="cancel" /></span>
</div>

</form>
</div>
</jsp:body>
</ispr:page>