功能描述：在页面中有多个tab需要切换，页面加载或点击搜索按钮时异步获取全部tab的数据，并在tab的表头中显示每个tab的数据条数。
效果如图所示：
<div class="layui-card-body"> <div class="layui-tab layui-tab-card"> <ul class="layui-tab-title" style="padding-right: 30px;height: auto!important;white-space: normal!important;"> <li class="layui-this">行业 var $li = $(".layui-tab ul li"); for(var i=0;i<$li.length;i++){ var text = $li.eq(i).text(); if(text.indexOf(name)>-1){ $li.eq(i).text(name+"("+count+")"); return; } } } //行业 var industryTable = table.render({ elem: '#potential_industry' ,url : doGetPotentialIndustryUrl ,cols: [[ //标题栏 {field: 'index', title: '序号', width: 60} ,{field: 'mpanyName', title: '名称', width: 200} ,{field: 'socialCreditCode', title: '统一社会信用代码', width: 200} ,{field: 'industryType', title: '行业类别', width: 200} ,{field: 'technicalField', title: '技术领域', width: 200} ,{field: 'address', title: '详细地址', width: 200} ,{field: 'personInCharge', title: '负责人', width: 200} ,{field: 'contactInformation', title: '联系方式', width: 200} ]] ,even: true ,page: true //是否显示分页 ,limits: [8, 12, 15,18] ,limit: 12 //每页默认显示的数量 ,id: "potential_industry_table" ,done : function(res, curr, count){ changeNum("行业",count) } }) //企业 var companyTable = table.render({ elem: '#potential_company' ,url : doGetPotentialCompanyUrl ,cols: [[ //标题栏 {field: 'index', title: '序号', width: 60} ,{field: 'enterpriseName', title: '企业名称', width: 200} ,{field: 'socialCreditCode', title: '统一社会信用代码', width: 200} ,{field: 'enterpriseAddress', title: '企业所在地', width: 200} ,{field: 'industry', title: '所属行业', width: 200} ,{field: 'contacts', title: '联系人', width: 200} ,{field: 'contactInformation', title: '联系方式', width: 200} ,{field: 'mainBusiness', title: '主营业务', width: 200} ]] ,even: true ,page: true //是否显示分页 ,limits: [8, 12, 15,18] ,limit: 12 //每页默认显示的数量 ,id: "potential_company_table" ,done : function(res, curr, count){ changeNum("企业",count) } }) //人员 var personTable = table.render({ elem: '#potential_person' ,url : doGetPotentialPersonUrl ,cols: [[ //标题栏 {field: 'index', title: '序号', width: 60} ,{field: 'name', title: '姓名', width: 200} ,{field: 'idNumber', title: '身份证号', width: 200} ,{field: 'gender', title: '性别', width: 200} ,{field: 'politicalAppearance', title: '政治面貌', width: 200} ,{field: 'culturalDegree', title: '文化程度', width: 200} ,{field: 'myselfPhone', title: '本人联系电话', width: 200} ,{field: 'technicalTitle', title: '技术职称', width: 200} ]] ,even: true ,page: true //是否显示分页 ,limits: [8, 12, 15,18] ,limit: 12 //每页默认显示的数量 ,id: "potential_person_table" ,done : function(res, curr, count){ changeNum("人员",count) } }) //表格重载方法 function reloadTable(id,target_url,param){ table.reload(id,{ url:target_url, where:param }); } //查询按钮点击事件 $("#searchBtn").on("click",function(data){ var searchInfo = $("#searchInfo").val(); var param = { searchKey: searchInfo } //行业表格重载 reloadTable('potential_industry_table',doGetPotentialIndustryUrl,param); //企业表格重载 reloadTable('potential_company_table',doGetPotentialCompanyUrl,param); //人员表格重载 reloadTable('potential_person_table',doGetPotentialPersonUrl,param); })
