代码备份jquery.smart.js
苏坚成
jquery.smart.js
/*此脚本依赖JQuery,layer,datatables*/
/*JQuery namespace function */
/*采用命名空间的函数仍然是全局函数，调用： $.sb.init('path/page',[{ data: 'id' },{ data: 'name' }]); */
jQuery.sb = {
init: function(url, columns, aoColumnDefs) {
$('#dynamicData').DataTable({
responsive: true,
"processing": true,
"serverSide": true,
"oLanguage": {
"sUrl": "../plugs/datatables/zh_CN.json"
},
ajax: url,
columns: columns,
aoColumnDefs: aoColumnDefs
});
},
selected:function(){
$('#dynamicData tbody').on( 'click', 'tr', function () {
if ( $(this).hasClass('table-selected') ) {
$(this).removeClass('table-selected');
}
else {
table.$('tr.table-selected').removeClass('table-selected');
$(this).addClass('table-selected');
}
} );
},
add: function(title, area, url) {
layer.open({
type: 2,
title: title,
shadeClose: true,
shade: 0.6,
area: area,
content: url
});
},
update: function(title, area, url, table) {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data["id"];
layer.open({
type: 2,
title: title,
shadeClose: true,
shade: 0.6,
area: area,
content: url + "/" + id
});
},
deleted: function(url, table) {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定删除?", {
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: url + "/" + id,
success: function(data) {
refresh(table);
layer.msg("删除成功", {
icon: 1
});
}
});
}
);
},
refresh: function(table) {
//此处调用datatables重新加载函数
table.ajax.reload(null, false);
},
disable: function(url, table) {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定禁用?", {
title: '提醒',
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: url + "/" + id,
success: function(data) {
refresh(table);
layer.msg("禁用成功", {
icon: 1
});
}
});
}
);
},
enable: function(url, table) {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定启用?", {
title: '提醒',
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: url + "/" + id,
success: function(data) {
refresh(table);
layer.msg("启用成功", {
icon: 1
});
}
});
}
);
},
print: function() {
layer.msg("打印实现中...");
},
exp: function() {
layer.msg("导出实现中...");
},
help: function() {
layer.msg("帮助实现中...");
}
};
/*JQuery object plugin */
/*对象级别的插件，调用： $(this).sb({foreground: 'blue'}); */
(function($) {
$.fn.sb = function(options) {
var defaults = {
init: {
table: {}
},
method: {
addBtn: {
title: '新增',
area: ['320px', '200px'],
url: 'http://www.sun4j.com'
},
updateBtn: {
title: '修改',
area: ['320px', '200px'],
url: 'http://www.sun4j.com'
},
deleteBtn: {
url: 'http://www.sun4j.com'
},
disableBtn: {
url: 'http://www.sun4j.com'
},
enableBtn: {
url: 'http://www.sun4j.com'
},
exportBtn: {
url: ''
},
printBtn: {
url: ''
},
helpBtn: {
url: ''
},
refreshBtn: {
url: ''
}
}
};
layer.msg('此处验证table是否初始化成功！');
var opts = $.extend(defaults, options);
var table = defaults.init.table;
$.fn.sb.refresh = function() {
table.ajax.reload(null, false);
}
$('#dynamicData tbody').on('click', 'tr', function() {
if ($(this).hasClass('table-selected')) {
$(this).removeClass('table-selected');
} else {
table.$('tr.table-selected').removeClass('table-selected');
$(this).addClass('table-selected');
}
});
$.each(defaults.method, function(k, v) {
if ('addBtn' == $.trim(k)) {
$("#addBtn").click(function() {
layer.open({
type: 2,
title: v.title,
shadeClose: true,
shade: 0.6,
area: v.area,
content: v.url
});
});
} else if ('updateBtn' == $.trim(k)) {
$("#updateBtn").click(function() {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data['id'];
layer.open({
type: 2,
title: v.title,
shadeClose: true,
shade: 0.6,
area: v.area,
content: v.url + "/" + id
});
});
} else if ('deleteBtn' == $.trim(k)) {
$("#deleteBtn").click(function() {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定删除?", {
title: '删除',
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: v.url + "/" + id,
success: function(data) {
$.fn.sb.refresh();
layer.msg("删除成功", {
icon: 1
});
}
});
}
);
});
} else if ('disableBtn' == $.trim(k)) {
$("#disableBtn").click(function() {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
if (!data["disable"]) {
layer.msg('已经是启用状态', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定禁用?", {
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: v.url + "/" + id,
success: function(data) {
$.fn.sb.refresh();
layer.msg("禁用成功", {
icon: 1
});
}
});
}
);
});
} else if ('enableBtn' == $.trim(k)) {
$("#enableBtn").click(function() {
var data = table.row($('tr.table-selected')).data();
if (typeof(data) == "undefined") {
layer.msg('请选择操作记录', {
icon: 2
});
return;
}
if (data["disable"]) {
layer.msg('已经是启用状态', {
icon: 2
});
return;
}
var id = data['id'];
layer.confirm("确定启用?", {
btn: ['<i class="fa fa-check"></i> 确定', '<i class="fa fa-reply "></i> 取消'],
shade: 0.6
},
function() {
$.ajax({
type: "GET",
url: v.url + "/" + id,
success: function(data) {
$.fn.sb.refresh();
layer.msg("启用成功", {
icon: 1
});
}
});
}
);
});
} else if ('exportBtn' == $.trim(k)) {
$("#exportBtn").click(function() {
layer.msg("导出实现中...");
});
} else if ('printBtn' == $.trim(k)) {
$("#printBtn").click(function() {
layer.msg("打印实现中...");
});
} else if ('helpBtn' == $.trim(k)) {
$("#helpBtn").click(function() {
layer.msg("帮助实现中...");
});
} else {
$("#refreshBtn").click(function() {
$.fn.sb.refresh();
});
}
});
}
})(jQuery);依赖：
<!-- jQuery -->
<script th:src="@{/plugs/jquery/jquery.min.js}"></script>
<!-- Bootstrap Core JavaScript -->
<script th:src="@{/plugs/bootstrap/js/bootstrap.min.js}"></script>
<!-- Metis Menu Plugin JavaScript -->
<script th:src="@{/plugs/metisMenu/metisMenu.min.js}"></script>
<!-- DataTables JavaScript -->
<script th:src="@{/plugs/datatables/js/jquery.dataTables.min.js}"></script>
<script th:src="@{/plugs/datatables/js/dataTables.bootstrap.min.js}"></script>
<script th:src="@{/plugs/layer/layer.js}"></script>
<!-- Custom Theme JavaScript -->
<script th:src="@{/js/jquery.smart.js}"></script>页面调用：
<footer th:include="fragments/footer :: fragment_footer"></footer>
<script type="text/javascript" th:inline="javascript">
var cn_url =/*[[@{/plugs/datatables/zh_CN.json}]]*/;
var page_url =/*[[@{/organization/page}]]*/;
var edit_url=/*[[@{/organization/edit}]]*/;
var del_url=/*[[@{/organization/delete}]]*/;
var disable_url=/*[[@{/organization/disable}]]*/;
$(document).ready(function() {
$(".account").addClass("active");
$(".organization").addClass("active");
var table = $('#dynamicData').DataTable({
responsive: true,
"processing": true,
"serverSide": true,
"ajax": page_url,
"oLanguage": {
"sUrl": cn_url
},
"columns": [
{"data": "id"},
{"data": "name"},
{"data": "posts"},
{"data": "authoritys"},
{"data": "disable"}
],
"aoColumnDefs": [
{
"targets": [0],
"visible": false,
"searchable": false
}, {
"bSortable": false,
"aTargets": [4]
}, {
"class": "tn",
"targets": [4]
}, {
"targets": [4],
"data": "disable",
"render": function(data, type, full) {
return '' + seStatus(data) + '';
}
}]
});
var defaults = {
init: {
table: table,
},
method: {
addBtn: {
title: '新增',
area: ['640px', '380px'],
url: edit_url
},
updateBtn: {
title: '修改',
area: ['640px', '380px'],
url: edit_url
},
deleteBtn: {
url: del_url
},
disableBtn: {
url: disable_url
},
enableBtn: {
url: disable_url
},
refreshBtn: {}
}
};
$(this).sb(defaults);
});
function seStatus(status) {
if (status) {
return "启用";
} else {
return "冻结";
}
}
</script>
类似资料：