您的位置：首页 > Web前端 > BootStrap

jsp bootstrap表单页面

2013-11-26 16:46 253 查看
简述：

这是一个bootstrp的jsp表单页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Mobile Upload</title>
<link rel="stylesheet" href="<%=basePath%>static/css/bootstrap.css">
<link rel="stylesheet" href="<%=basePath%>static/css/upns.css">
<script src="<%=basePath%>static/js/jquery-1.8.1.js"></script>
<script src="<%=basePath%>static/js/bootstrap.js"></script>
<link rel="stylesheet" href="<%=basePath%>static/css/colorbox.css" type="text/css">
<script type="text/javascript" src="<%=basePath%>static/js/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/js/jquery-form/jquery.form.js"></script>

</head>
<body>
<div class="panel panel-default">
<div class="panel-heading breadcrumb">
<li>修改应用</li>
</div>
<div class="panel-body">

<form id="form" role="form" action="/upns-console/member/join" method="post">
<div class="form-group">
<label for="appId" class="col-lg-2 control-label">appID： ${app.appID }</label>
<input type="hidden" class="form-control" id="appID" name="appID" value="${app.appID }"/>
</div>

<div class="form-group">
<label for="appId" class="col-lg-2 control-label">应用类型： ${app.type==0 ? "Android":"iOS"}</label>
<div class="col-lg-10">
<select name="sysName" style="display:none">
${app.type==0 ? "<option value=\"apk\">Android</option>":"<option value=\"ipa\">iOS</option>"}
</select>
</div>
</div>

<div class="form-group">
<label for="name" class="col-lg-2 control-label">应用名称</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="appName" name="name" value="${app.name }" placeholder="应用名称" />
</div>
</div>

<div class="form-group">
<label for="description" class="col-lg-2 control-label">应用描述</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="appDescription" name="description" value="${app.description }" placeholder="应用描述" />
</div>
</div>

<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<a class="btn btn-success" href="javascript:updateApp()" class="btn btn-success" style="float:right"><span id="submintBtn">保存修改</span></a>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
<script type="text/javascript">
/**
* 保存新应用
*/
function updateApp(){
var appID = $("#appID").val();
if(appID=='' || appID==undefined){
alert('appID不能为空！')
return;
}
var appName = $("#appName").val();
if(appName=='' || appName==undefined){
alert('应用名称不能为空！')
return;
}
var options = {
url:"<%=basePath %>AppModify",
type:'POST',
dataType :'json',
beforeSend: function(XHR){
//showLoading("正在保存，请等待...");
},
success: function(data){
if (parent) {
parent.closeColorbox(true);
}
}, //显示操作提示
error: function(){
alert("保存失败，可能appID出现重复");
//dismissLoading();
}
};
$('#form').ajaxSubmit(options);
}
</script>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航