📄 insert_staff.jsp
字号:
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'inserts_student.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--<link rel="stylesheet" type="text/css" href="<%=basePath %>/styles/insert_student.css">-->
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript" src="ext/source/ext-lang-zh_CN.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(
function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';
var myForm = new Ext.form.FormPanel({
title:"添加职员",
width:425,
frame:true,
//items
items: [
//staffNum
new Ext.form.TextField({
id:"staffNum",
name:'staffNum',
fieldLabel:"职员号",
width:275,
allowBlank:false,
blankText:"Please enter the staff number"
}),
//lname
new Ext.form.TextField({
id:"lname",
name:'lname',
grow:true,
fieldLabel:"姓",
width:275,
allowBlank:false,
blankText:"Please enter the last name"
}),
//fname
new Ext.form.TextField({
id:"fname",
name:'fname',
grow:true,
fieldLabel:"名",
width:275,
allowBlank:false,
blankText:"Please enter the first name"
}),
//birthday
new Ext.form.DateField({
fieldLabel:'birthday',
name:'birthday',
format:'Y-m-d' ,
allowBlank:false,
//disabledDays:[0,6] , //不让选择周六，周日
//disabledDaysText:"周末要休息",
invalidText :"您输入了不该输入的字符"
}),
//sex
new Ext.form.FieldSet({ //加一个FieldSet就把两个radio当作一组
border:false,
title:'性别',
layout:'table', //加这个属性 Radio 就是横着放的
items:[
new Ext.form.Radio({
labelSeparator:'',
name:"sex",
checked:true,
inputValue:"M",//必须是inputValue而不能是value否则servlet无法获取值
boxLabel:'男'
}),
new Ext.form.Radio({
labelSeparator:'',
name:"sex",
checked:false,
inputValue:"F",
boxLabel:'女'
})
]
}),
//position
new Ext.form.TextField({
id:"position",
name:'position',
fieldLabel:"职位",
width:275,
allowBlank:false,
blankText:"Please enter the position"
}),
//location
new Ext.form.TextField({
id:"location",
name:'location',
fieldLabel:"办公地点",
width:275,
allowBlank:false,
blankText:"Please enter the location"
}),
//city
new Ext.form.TextField({
id:"city",
name:'city',
fieldLabel:"城市",
width:275,
allowBlank:false,
blankText:"Please enter the city"
}),
//street
new Ext.form.TextField({
id:"street",
name:'street',
fieldLabel:"街道",
width:275,
allowBlank:false,
blankText:"Please enter the street"
}),
//postcode
new Ext.form.TextField({
id:"postcode",
name:'postcode',
fieldLabel:"邮政编码",
width:275,
allowBlank:false,
blankText:"Please enter the postcode"
})
],
//buttons
buttons: [
{
text:"提交",
type:'submit',
handler:function(){
if(myForm.form.isValid()){//验证合法后使用加载进度条
Ext.MessageBox.show({
title: '请稍等',
msg: '正在提交...',
progressText: '',
width:300,
progress:true,
closable:false,
animEl: 'loding'
});
//控制进度速度
var f = function(v){
return function(){
var i = v/11;
Ext.MessageBox.updateProgress(i, '');
};
};
for(var i = 1; i < 6; i++){
setTimeout(f(i), i*150);
}
//提交到服务器操作
myForm.form.doAction(
'submit',
{
url:'<%=basePath%>insertStaff2.do',//servlet文件路径
method:'post',//提交方法post或get
params:'',
//提交成功的回调函数
success:function(form,action){
if (action.result.msg=='success') {
Ext.Msg.alert('操作成功',action.result.msg);
}
else
if(action.result.msg=='existedStaff'){
Ext.Msg.alert('该学生已存在',action.result.msg);
}
else{
Ext.Msg.alert('抱歉操作失败',action.result.msg);
}
},
//提交失败的回调函数
failure:function(){
Ext.Msg.alert('错误','服务器出现错误请稍后再试！');
}
}
);
}
}
},
{
text:"重置",
handler:function(){myForm.form.reset();}//重置表单
}
]
});
win = new Ext.Window({
id:'win',
title:'添加职员',
layout:'fit', //之前提到的布局方式fit，自适应布局
width:450,
height:450,
plain:true,
bodyStyle:'padding:5px;',
maximizable:false,//禁止最大化
closeAction:'close',
closable:false,//禁止关闭
collapsible:true,//可折叠
plain: true,
buttonAlign:'center',
items:myForm//将表单作为窗体元素嵌套布局
});
// myForm.render(document.body);
win.show(document.body);
});
</script>
<div id="container">
</div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -