使用jtable插件的JSP CRUD操作
我将jtablejquery插件用于带有JSP和servlet的CRUD应用程序 我的要求是，若记录的状态是活动的，那个么它应该是可更新的，否则若状态是不活动的，那个么记录就不能更新使用jtable插件的JSP CRUD操作,jsp,servlets,crud,jquery-jtable,Jsp,Servlets,Crud,Jquery Jtable,我将jtablejquery插件用于带有JSP和servlet的CRUD应用程序 我的要求是，若记录的状态是活动的，那个么它应该是可更新的，否则若状态是不活动的，那个么记录就不能更新 jtable CRUD Operations JSP J2EE中使用jTable的CRUD操作 $（文档）.ready（函数（）{ $（“#StudentTableContainer”）.jtable({ 标题:"学生名单",， 是的， 页面大小：10， 排序：对， defaultSorting:'student
jtable CRUD Operations
JSP
J2EE中使用jTable的CRUD操作
$（文档）.ready（函数（）{
$（“#StudentTableContainer”）.jtable({
标题:"学生名单",，
是的，
页面大小：10，
排序：对，
defaultSorting:'studentId desc'，
行动：{
listAction:“/Controller？action=list”，
createAction:'/Controller？action=create'，
updateAction:“/Controller？action=update”，
deleteAction:“/Controller？action=delete”
},
字段：{
学生ID：{
标题：“学生Id”，
宽度：“5%”，
关键：没错，
列表：正确，
编辑：false，
创建：true
},
姓名：{
标题：“姓名”，
宽度：“20%”，
编辑：对，
inputClass:“验证[必需]”
},
部门：{
标题:"部门",，
宽度：“10%”，
编辑：对，
inputClass:“验证[必需，最大大小[5]]”
},
电邮：{
标题：“电子邮件”，
宽度：“15%”，
编辑：对，
inputClass:“验证[必需，自定义[电子邮件]]”
},
性别：{
标题：“性别”，
宽度：“5%”，
选项：{'M'：'Male'，'F'：'Female'}
},
城市：{
标题:"城市",，
宽度：“20%”，
选项：'/Controller？action=getCity'
},
地位：{
标题:"地位",，
宽度：“5%”，
选项：{'Active'：'Active'，'Inactive'：'Inactive'}
},
出生日期：{
标题：“出生日期”，
宽度：“25%”，
键入：“日期”
，显示格式：'yy-mm-dd'
}
},
//创建表单时初始化验证逻辑
formCreated:函数（事件、数据）{
data.form.validationEngine（）；
},
//在提交表单时验证表单
表单提交：功能（事件、数据）{
//data.formType：
//数据格式：
//data.row：
//警报（“FormType（编辑或创建）=”+数据.FormType）；
if（data.formType=='edit'）{
//警报（“101 data.row为”+data.row.record）；
}
如果（！确认（“是否要保存记录？”））{
返回false；
}
返回data.form.validationEngine（'validate'）；
},
//关闭窗体时处理验证逻辑
formClosed：函数（事件、数据）{
data.form.validationEngine（'hide'）；
data.form.validationEngine（'detach'）；
}
});
$（'#StudentTableContainer'）.jtable（'load'）；
});
J2ee中使用jTable的基于AJAX的CRUD操作
JSP
<html>
<head>
<title>CRUD operations using jTable in J2EE</title>
<!-- Include one of jTable styles. -->
<link href="css/metro/blue/jtable.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" />
<!-- Include jTable script file. -->
<script src="js/jquery-1.8.2.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>
<script src="js/jquery.jtable.js" type="text/javascript"></script>
<!-- validation -->
<link href="css/validationEngine.jquery.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.validationEngine-en.js" type="text/javascript"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#StudentTableContainer').jtable({
title : 'Students List',
paging:true,
pageSize:10,
sorting: true,
defaultSorting: 'studentId desc',
actions : {
listAction : '<%=request.getContextPath()%>/Controller?action=list',
createAction : '<%=request.getContextPath()%>/Controller?action=create',
updateAction : '<%=request.getContextPath()%>/Controller?action=update',
deleteAction : '<%=request.getContextPath()%>/Controller?action=delete'
},
fields : {
studentId : {
title : 'Student Id',
width : '5%',
key : true,
list : true,
edit : false,
create : true
},
name: {
title : 'Name',
width : '20%',
edit : true,
inputClass: 'validate[required]'
},
department : {
title : 'Department',
width : '10%',
edit : true,
inputClass: 'validate[required, maxSize[5]]'
},
email : {
title : 'Email',
width : '15%',
edit : true,
inputClass: 'validate[required,custom[email]]'
},
gender: {
title: 'Gender',
width: '5%',
options: { 'M': 'Male', 'F': 'Female' }
},
city: {
title: 'City',
width: '20%',
options: '<%=request.getContextPath()%>/Controller?action=getCity'
},
status: {
title: 'Status',
width: '5%',
options: {'Active':'Active','Inactive':'Inactive'}
},
birthDate: {
title: 'Birth date',
width: '25%',
type: 'date'
, displayFormat: 'yy-mm-dd'
}
},
//Initialize validation logic when a form is created
formCreated: function (event, data) {
data.form.validationEngine();
},
//Validate form when it is being submitted
formSubmitting: function (event,data) {
//data.formType:
//data.form:
//data.row:
// alert("FormType(edit or create) ="+data.formType);
if(data.formType=='edit'){
// alert("101 data.row is "+data.row.record);
}
if (!confirm(" Do you want to save the records ?")) {
return false ;
}
return data.form.validationEngine('validate');
},
//Dispose validation logic when form is closed
formClosed: function (event, data) {
data.form.validationEngine('hide');
data.form.validationEngine('detach');
}
});
$('#StudentTableContainer').jtable('load');
});
</script>
</head>
<body>
<div style="width: 80%; margin-right: 10%; margin-left: 10%; text-align: center;">
<h4>AJAX based CRUD operations using jTable in J2ee</h4>
<div id="StudentTableContainer"></div>
</div>
<a href="jTableIndex.jsp" style="font-size: 14px">|Back|</a>
</body>
</html>