您的位置:首页 > 产品设计 > UI/UE

php+layui创建表格使用实例

2017-08-28 20:14 761 查看
<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312">
<title>table模块快速使用</title>
<link rel="stylesheet" href="css/layui.css" media="all">
</head>
<body>
<div class="layui-btn-group demoTable">
<button class="layui-btn" data-type="getCheckData">获取选中行数据</button>
<button class="layui-btn" data-type="getCheckLength">获取选中数目</button>
<button class="layui-btn" data-type="isAll">验证是否全选</button>
</div>
<table class="layui-table" lay-data="{height:515, url:'user/',where: {token: 'sasasas', id: 123}, method: 'post', page:true, id:'test'}" lay-filter="test">
<thead>
<tr>
<th lay-data="{checkbox:true, fixed: true}"></th>
<th lay-data="{field:'id', width:80, sort: true}">ID</th>
<th lay-data="{field:'username', width:80, templet: '#usernameTpl'}">用户名</th>
<th lay-data="{field:'sex', width:80, sort: true,templet: '#sexTpl'}">性别</th>
<th lay-data="{field:'city', width:80}">城市</th>
<th lay-data="{field:'sign', width:177}">签名</th>
<th lay-data="{field:'experience', width:80, sort: true}">积分</th>
<th lay-data="{field:'score', width:80, sort: true}">评分</th>
<th lay-data="{field:'classify', width:80}">职业</th>
<th lay-data="{field:'wealth', width:135, sort: true}">财富</th>
<th lay-data="{fixed: 'right', width:100, align:'center', toolbar: '#barDemo1'}"></th>
</tr>
</thead>
<tr>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
</tr><tr>
<td>1002</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
<td>1001</td>
</tr>
</table>

<script src="layui.js"></script>
<script>
layui.use('table', function(){
var table = layui.table;
});
</script>
<script type="text/html" id="barDemo1">
<a href="/?table-demo-id={{d.id}}" class="layui-btn layui-btn-mini" lay-event="edit" target="_blank">审核</a>
</script>
<script type="text/html" id="usernameTpl">
<a href="/?table-demo-id={{d.id}}" class="layui-table-link" target="_blank">{{ d.username }}</a>
</script>
<script type="text/html" id="sexTpl">
{{#  if(d.sex === '女'){ }}
<span style="color: #F581B1;">{{ d.sex }}</a>
{{#  } else { }}
{{ d.sex }}
{{#  } }}
</script>
<script>
layui.use('table', function(){
var table = layui.table;

//监听表格复选框选择
table.on('checkbox(test)', function(obj){
console.log(obj)
});

var $ = layui.$, active = {
getCheckData: function(){
var checkStatus = table.checkStatus('test')
,data = checkStatus.data;
layer.alert(JSON.stringify(data));
}
,getCheckLength: function(){
var checkStatus = table.checkStatus('test')
,data = checkStatus.data;
layer.msg('选中了:'+ data.length + ' 个');
}
,isAll: function(){
var checkStatus = table.checkStatus('test');
layer.msg(checkStatus.isAll ? '全选': '未全选')
}
,reload: function(){
var demoReload = $('#demoReload');

ins1.reload({
where: {
key: {
id: demoReload.val()
}
}
});
}
,parseTable: function(){
table.init('parse-table-demo');
}
};

$('.demoTable .layui-btn').on('click', function(){
var type = $(this).data('type');
active[type] ? active[type].call(this) : '';
});
});
</script>
</body>
</html>

 

<?

$b="";

foreach($_REQUEST as $k=>$v){

 $b.=$k."***".$v."<br>";

 }

$myfile = fopen("newfile.txt", "a") or die("Unable to open file!");  //w  重写  a追加

//$txt = $empId."\n".$loginName."\n".$empName."\n".$loginPwd."\n".$tel."\n";

fwrite($myfile, $b);

fclose($myfile); 

$a='{"code":0,"msg":"","count":799,"data":[{"id":10000,"username":"user-0","sex":"女","city":"chengshi-0","sign":"qianming-0","experience":255,"logins":24,"wealth":82830700,"classify":"作家","score":57},{"id":10001,"username":"user-1","sex":"男","city":"chengshi-1","sign":"qianming-1","experience":884,"logins":58,"wealth":64928690,"classify":"词人","score":27},{"id":10002,"username":"user-2","sex":"女","city":"chengshi-2","sign":"qianming-2","experience":650,"logins":77,"wealth":6298078,"classify":"酱油","score":31},{"id":10003,"username":"user-3","sex":"女","city":"chengshi-3","sign":"qianming-3","experience":362,"logins":157,"wealth":37117017,"classify":"诗人","score":68},{"id":10004,"username":"user-4","sex":"男","city":"chengshi-4","sign":"qianming-4","experience":807,"logins":51,"wealth":76263262,"classify":"作家","score":6},{"id":10005,"username":"user-5","sex":"女","city":"chengshi-5","sign":"qianming-5","experience":173,"logins":68,"wealth":60344147,"classify":"作家","score":87},{"id":10006,"username":"user-6","sex":"女","city":"chengshi-6","sign":"qianming-6","experience":982,"logins":37,"wealth":57768166,"classify":"作家","score":34},{"id":10007,"username":"user-7","sex":"男","city":"chengshi-7","sign":"qianming-7","experience":727,"logins":150,"wealth":82030578,"classify":"作家","score":28},{"id":10008,"username":"user-8","sex":"男","city":"chengshi-8","sign":"qianming-8","experience":951,"logins":133,"wealth":16503371,"classify":"词人","score":14},{"id":10009,"username":"user-9","sex":"女","city":"chengshi-9","sign":"qianming-9","experience":484,"logins":25,"wealth":86801934,"classify":"词人","score":75},{"id":10010,"username":"user-10","sex":"女","city":"chengshi-10","sign":"qianming-10","experience":1016,"logins":182,"wealth":71294671,"classify":"诗人","score":34},{"id":10011,"username":"user-11","sex":"女","city":"chengshi-11","sign":"qianming-11","experience":492,"logins":107,"wealth":8062783,"classify":"诗人","score":6},{"id":10012,"username":"user-12","sex":"女","city":"chengshi-12","sign":"qianming-12","experience":106,"logins":176,"wealth":42622704,"classify":"词人","score":54},{"id":10013,"username":"user-13","sex":"男","city":"chengshi-13","sign":"qianming-13","experience":1047,"logins":94,"wealth":59508583,"classify":"诗人","score":63},{"id":10014,"username":"user-14","sex":"男","city":"chengshi-14","sign":"qianming-14","experience":873,"logins":116,"wealth":72549912,"classify":"词人","score":8},{"id":10015,"username":"user-15","sex":"女","city":"chengshi-15","sign":"qianming-15","experience":1068,"logins":27,"wealth":52737025,"classify":"作家","score":28},{"id":10016,"username":"user-16","sex":"女","city":"chengshi-16","sign":"qianming-16","experience":862,"logins":168,"wealth":37069775,"classify":"酱油","score":86},{"id":10017,"username":"user-17","sex":"女","city":"chengshi-17","sign":"qianming-17","experience":1060,"logins":187,"wealth":66099525,"classify":"作家","score":69},{"id":10018,"username":"user-18","sex":"女","city":"chengshi-18","sign":"qianming-18","experience":866,"logins":88,"wealth":81722326,"classify":"词人","score":74},{"id":10019,"username":"user-19","sex":"女","city":"chengshi-19","sign":"qianming-19","experience":682,"logins":106,"wealth":68647362,"classify":"词人","score":51},{"id":10020,"username":"user-20","sex":"男","city":"chengshi-20","sign":"qianming-20","experience":770,"logins":24,"wealth":92420248,"classify":"诗人","score":87},{"id":10021,"username":"user-21","sex":"男","city":"chengshi-21","sign":"qianming-21","experience":184,"logins":131,"wealth":71566045,"classify":"词人","score":99},{"id":10022,"username":"user-22","sex":"男","city":"chengshi-22","sign":"qianming-22","experience":739,"logins":152,"wealth":60907929,"classify":"作家","score":18},{"id":10023,"username":"user-23","sex":"女","city":"chengshi-23","sign":"qianming-23","experience":127,"logins":82,"wealth":14765943,"classify":"作家","score":30},{"id":10024,"username":"user-24","sex":"女","city":"chengshi-24","sign":"qianming-24","experience":212,"logins":133,"wealth":59011052,"classify":"词人","score":76},{"id":10025,"username":"user-25","sex":"女","city":"chengshi-25","sign":"qianming-25","experience":938,"logins":182,"wealth":91183097,"classify":"作家","score":69},{"id":10026,"username":"user-26","sex":"男","city":"chengshi-26","sign":"qianming-26","experience":978,"logins":7,"wealth":48008413,"classify":"作家","score":65},{"id":10027,"username":"user-27","sex":"女","city":"chengshi-27","sign":"qianming-27","experience":371,"logins":44,"wealth":64419691,"classify":"诗人","score":60},{"id":10028,"username":"user-28","sex":"女","city":"chengshi-28","sign":"qianming-28","experience":977,"logins":21,"wealth":75935022,"classify":"作家","score":37},{"id":10029,"username":"user-29","sex":"男","city":"chengshi-29","sign":"qianming-29","experience":647,"logins":107,"wealth":97450636,"classify":"酱油","score":27}]}';

echo $a;

?>



 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: