bootstraptable.js动态填充单元格数据的方法有哪些-创新互联-乐山大橙子建站

新闻中心

这里有您想知道的互联网营销解决方案

bootstraptable.js动态填充单元格数据的方法有哪些-创新互联

这篇文章主要为大家展示了“bootstrap table.js动态填充单元格数据的方法有哪些”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“bootstrap table.js动态填充单元格数据的方法有哪些”这篇文章吧。

创新互联是一家网站设计、成都网站制作，提供网页设计，网站设计，网站制作，建网站，按需开发，网站开发公司，公司2013年成立是互联行业建设者，服务者。以提升客户品牌价值为核心业务，全程参与项目的网站策划设计制作，前端开发，后台程序制作以及后期项目运营并提出专业建议和思路。

bootstrap-table.js动态填充table单元格数据，总结了几种方法以适应各种需求，以下就简单介绍两种方法：

方法一：全部自动填充table

$('#table-javascript').bootstrapTable({ method : 'get', url : ContextUtil.zutnlp_spark_info, cache : false, pagination : true, root : 'workers', total : 'totalElements', sidePagination : 'server', columns : [ { field : 'address', title : 'Address', align : 'center', valign : 'middle' }, { field : 'state', title : 'State', align : 'center', valign : 'middle', } ] }); $(window).resize(function() { $('#table-javascript').bootstrapTable('resetView'); });

方法二：表头这一栏固定，自动填充主体部分




  
  
  
  
  
  
  
  



  
    
      
      Address
      States
      Cores
      CoresUsed
      Memory
      MemoryUsed

$(function() { $.ajax({ url : ContextUtil.zutnlp_spark_info, type : "GET", success : function(data) { //调用创建表和填充动态填充数据的方法. createShowingTable(data) }, error : function() { } }); }); //动态的创建一个table，同时将后台获取的数据动态的填充到相应的单元格 function createShowingTable(data) { //获取后台传过来的jsonData,并进行解析 //此处需要让其动态的生成一个table并填充数据 var tableStr = ""; var len = data.workers.length; for (var i = 0; i < len; i++) { tableStr = tableStr + "" + data.workers[i].address + "" + "" + data.workers[i].state + "" + "" + data.cores + "" + "" + data.coresUsed + "" + "" + data.memory + "" + "" + data.memoryUsed + ""; } //将动态生成的table添加的事先隐藏的div中. $("#dataTable").html(tableStr); }

以上是“bootstrap table.js动态填充单元格数据的方法有哪些”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！

新闻名称：bootstraptable.js动态填充单元格数据的方法有哪些-创新互联
文章分享：http://lswzjz.com/article/djcgjo.html

新闻中心

其他资讯