版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/messicr7/article/details/80665137
1.页面初始化：
$(document).ready(function(){
fileUploader();
// 初始化页面回显
$.ajax({
url: "${ctx}/clientversion/clientversion/getList",
dataType: "json",
type: 'post',
cache: false,
success: function (data) {
$.each(data,function(index,clientVersionEntity){
if(clientVersionEntity.type == '3'){
$("#windowsCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#windowsVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}else if(clientVersionEntity.type == '1'){
$("#androidCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#androidVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}else if(clientVersionEntity.type == '2'){
$("#iosCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#iosVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}
});
},
error:function(){
console.log('数据请求失败');
}
});
});需要传递的数据类型：
[{
"id": 4,
"type": 2,
"size": "13071217",
"versionCode": "98",
"versionName": "1.0.3",
"url": "/eim/static/eim_download/download/eim.ipa",
"forceUpdate": 0
}, {
"id": 5,
"type": 1,
"size": "25137514",
"versionCode": "61",
"versionName": "1.2.25",
"url": "/eim/static/eim_download/download/eim.apk",
"forceUpdate": 0
}, {
"id": 6,
"type": 3,
"size": "19633931",
"versionCode": "8.1.0.65535",
"versionName": "8.1.0.65535",
"url": "/eim/static/eim_download/download/eim.exe",
"forceUpdate": 0
}]2.点击保存：
$("#btnSave").click(function(){
$(this).attr("disabled","disabled")//将input元素设置为disabled
var params,windowsEnforceUpdate,androidEnforceUpdate,iosEnforceUpdate;
windowsEnforceUpdate = $("#windowsVersion").is(":checked") ? 1 : 0;
androidEnforceUpdate = $("#androidVersion").is(":checked") ? 1 : 0;
iosEnforceUpdate = $("#iosVersion").is(":checked") ? 1 : 0;
param='[{"type":3,"forceUpdate":' + windowsEnforceUpdate + '},{"type":1,"forceUpdate":' + androidEnforceUpdate + '},{"type":2,"forceUpdate":' + iosEnforceUpdate + '}]';
// 点击保存按钮
$.ajax({
url: "${ctx}/clientversion/clientversion/save",
dataType: "json",
type: 'post',
cache: false,
data:{ListEntity: param},
success: function (data) {
$.each(data,function(index,clientVersionEntity){
if(clientVersionEntity.type == '3'){
$("#windowsCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#windowsVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}else if(clientVersionEntity.type == '1'){
$("#androidCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#androidVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}else if(clientVersionEntity.type == '2'){
$("#iosCilent").val(clientVersionEntity.versionName == 'null' ? '' : clientVersionEntity.versionName);
$("#iosVersion").prop("checked",clientVersionEntity.forceUpdate == '1' ? true : false);
}
});
$.jBox.tip("保存成功", 'success');
$("#cilentSave").removeAttr("disabled");//去除input元素的disabled属性
},
error:function(){
$.jBox.tip("保存失败", 'error');
}
});
});3.datatables ajax 调用：
<body>
<div id="container">
<!-- 定义一个表格元素 -->
<button id="redraw" class="btn btn-default">更换数据源</button>
<table id="example" class="table table-striped">
<thead>
<tr>
<th></th>
<th>项目名称</th>
<th>项目类型</th>
<th>负责人</th>
<th>参与人数</th>
<th>项目结束时间</th>
<th>操作</th>
</tr>
</thead>
<tbody></tbody>
<tfoot>
<tr>
<th></th>
<th>项目名称</th>
<th>项目类型</th>
<th>负责人</th>
<th>参与人数</th>
<th>项目结束时间</th>
<th>操作</th>
</tr>
</tfoot>
<!-- tbody是必须的 -->
</table>
</div>
<!-- Placed js at the end of the document so the pages load faster -->
<script src="js/jquery-2.2.4.js"></script>
<script src="assets/DataTables-1.10.15/media/js/jquery.dataTables.js"></script>
<script type="text/javascript">
/*Javascript代码片段*/
var t = $('#example').DataTable({
ajax: {
//指定数据源
url: "data/data.txt"
},
//每页显示三条数据
pageLength: 4,
columns: [{
"data": null //此列不绑定数据源，用来显示序号
},
{
"data": "projectName"
},
{
"data": "projectType"
},
{
"data": "PersonInCharge"
},
{
"data": "participants"
},
{
"data": "stopTime"
},
{
"data": "option"
}],
"columnDefs": [{
// "visible": false,
//"targets": 0
},
{
"render": function(data, type, row, meta) {
//渲染 把数据源中的标题和url组成超链接
return '<a href="' + data + '" target="_blank">' + row.option + '</a>';
},
//指定是第三列
"targets": 6
}]
});
//前台添加序号
t.on('order.dt search.dt',
function() {
t.column(0, {
"search": 'applied',
"order": 'applied'
}).nodes().each(function(cell, i) {
cell.innerHTML = i + 1;
});
}).draw();
//更换数据源（相同格式，但是数据内容不同）
$("#redraw").click(function() {
var url = t.ajax.url("http://localhost/mymodel/data/newData.txt");
url.load();
});
</script>
</body>数据格式：
{
"data": [
{
"projectName": "考试系统",
"projectType": "研发类",
"PersonInCharge": "项纪汉,刘晓晗",
"participants": "8",
"stopTime":"2018-05-01 00:00:00",
"option":""
},
{
"projectName": "金盾密信",
"projectType": "研发类",
"PersonInCharge": "邵喜元,石国栋,张超,刘爱娟",
"participants": "8",
"stopTime": "2017-09-30 00:00:00",
"option": ""
},
{
"projectName": "IDNS 2.0",
"projectType": "研发类",
"PersonInCharge": "项纪汉,刘晓晗",
"participants": "8",
"stopTime": "2017-12-31 00:00:00",
"option":""
},
{
"projectName": "考试系统",
"projectType": "研发类",
"PersonInCharge": "项纪汉,刘晓晗",
"participants": "8",
"stopTime": "2018-05-01 00:00:00",
"option":"删除"
}
]
}4.z-tree ajax调用：
<body>
<ul id="treeDemo" class="ztree"></ul>
<!-- Placed js at the end of the document so the pages load faster -->
<script src="js/jquery-2.2.4.js"></script>
<script src="js/jquery.metadata.js"></script>
<script src="assets/layui-v2.2.5/layui.all.js"></script>
<script src="assets/zTree_v3/js/jquery.ztree.all.js"></script>
<script type="text/javascript">
var setting = {
//复选框的开关
check: {
enable: true
},
data: {
//数据格式
simpleData: {
enable: true
}
}
};
$(document).ready(function(){
$.ajax({
url : 'data/z-tree.txt', //'data/z-tree.json',
type : 'ajax',
dataType : 'json',
type : 'get',
cache : false,
success : function(data){
console.log(data);
treeNodes = data;
$.fn.zTree.init($("#treeDemo"), setting, treeNodes);
},
error : function(){
layer.msg("网络延时，请重试。");
}
});
});
</script>
</body>数据格式：
[{
"id": 1,
"name": "顶级部门",
"open": true,
"pId": 0,
"isParent":true
}, {
"id": 23,
"name": "部门1",
"open": true,
"pId": 1
}, {
"id": 24,
"name": "部门11",
"open": true,
"pId": 23
}, {
"id": 25,
"name": "部门2",
"open": true,
"pId": 1
}, {
"id": 26,
"name": "部门22",
"open": true,
"pId": 25
}, {
"id": 27,
"name": "部门111",
"open": true,
"pId": 24
}, {
"id": 28,
"name": "部门222",
"open": true,
"pId": 26
}, {
"id": 29,
"name": "部门22下",
"open": true,
"pId": 25
}, {
"id": 30,
"name": "部门22测试",
"open": true,
"pId": 29
}, {
"id": 31,
"name": "部门22测试2",
"open": true,
"pId": 29
}, {
"id": 33,
"name": "部门22测试3",
"open": true,
"pId": 29
}, {
"id": 34,
"name": "部门22测试4",
"open": true,
"pId": 29
}, {
"id": 35,
"name": "部门22测试5",
"open": true,
"pId": 29
}, {
"id": 36,
"name": "部门22下测试",
"open": true,
"pId": 36
}, {
"id": 2,
"name": "未分组",
"open": true,
"pId": 1
}]