bootstrap table中文设置

bootstrap table和tableExport导出支持中文的Excel和pdf等表格 前言由于最近项目有一个导出表格为pdf格式,所以就做了这个功能。由于项目的表格是基于bootstrap和bootstrap table实现的,相对于easyUI来说它的优点是更方便,更好兼容。从代码可以发现bootstrap table本身是没有实现表格的导出的,需要扩展插件tableExport,扩展需要对pdf导出支持中文处理。 阅读详情

bootstrap table默认是英文语言包,我们可以通过以下设置进行本地化中文设置,比如分页、加载进度进行中文提示

方法一在html网页中加载语言包

<script src="bootstrap-table-en-US.js"></script> 
<script src="bootstrap-table-zh-CN.js"></script>

在html标签属性中设置语言

<table data-toggle="table" data-locale="en-US">
 </table>

或在js中设置语言

$('#table').bootstrapTable({  
 locale: 'en-US'
})

方法二自定义语言包

$('#table').bootstrapTable({ 
          //自定义分页字符串显示为中文
          formatShowingRows:function(pageFrom, pageTo, totalRows)
          {
            return "第"+pageFrom+"-"+pageTo+"行,总共"+totalRows+"";
          },
           //自定义分页字符串显示为中文
          formatRecordsPerPage:function(pageNumber)
          {
            return pageNumber+'行每页';
          }
  });

可自定义的本地化的方法如下

$('#table').bootstrapTable({ 
 //加载数据时提示
formatLoadingMessage:function()
{
return "数据加载中...";
},
//每页显示
formatRecordsPerPage:function(pageNumber)
{
     return pageNumber+'行每页';
  },
//页码
  formatShowingRows:function(pageFrom, pageTo, totalRows)
          {
            return "第"+pageFrom+"-"+pageTo+"行,总共"+totalRows+"";
   },

formatSRPaginationPreText :function(){
return '上一页';
},

formatSRPaginationPageText:function(page){
return '跳转至'+page;
},
 formatSRPaginationNextText:function(){
return '下一页';
},
 
 formatDetailPagination:function(totalRows)
 {
 return "总计:"+totalRows;
 }
,
formatSearch:function()
{
return  "搜索";
}
,
formatClearSearch:function()
{
return  "清除搜索";
}
 ,
formatNoMatches:function()
{
return  "未查询到相关记录";
} ,
  formatPaginationSwitch:function()
  {
  return "隐藏显示分页";
  }
,
formatPaginationSwitchDown:function()
  {
  return "显示分页";
  },
formatPaginationSwitchUp:function()
  {
  return "隐藏分页";
  } ,
formatRefresh:function()
  {
  return "刷新";
  }  ,
formatToggle:function()
  {
  return "展开";
  }  ,
formatToggleOn:function()
  {
  return "显示卡片视图";
  } ,  
  formatToggleOff :function()
  {
  return "隐藏卡片视图";
  },
formatColumns:function(){
return "列视图";
}
,
formatColumnsToggleAll:function()
{
return 'Toggle all';
}
 ,
formatFullscreen:function()
{
return '全屏';
} ,
formatAllRows function()
{
return '全部';
}

});

转载请注明:http://www.itxst.com/Bootstrap-Table/QuickStart.html

Bootstrap Table中文文档 bootstrap table各个属性值的详细说明,中文翻译版本。 立即下载

相关推荐

bootstrap-table-zh-CN.js

bootstrap-table-zh-CN.js,有需要就下载吧

bootstrap-table的使用(1)--导入与引用

在网页中添加表格,显示一些东西,比较麻烦,我们可以通过bootstrap-table,这个现成的包,来实现。bootstrap-table是bootstrap中一部分,只要应用于表格的显示。 导入与引用 使用方法,首先你得下载齐全一些js文件,以及一些css文件,主要是 jquery-3.4.1.min.js(不一定是这个版本) bootstrap.min.js(bootstrap的压缩包,导入,......

baidu_31788709的博客 5315

bootstrap datepicker插件默认英文修改为中文

datepicker插件默认为英文,而且格式为:mm/dd/yyyy这种情况,看起来不怎么直观。 修改目标: 1、默认显示为中文  2、格式为:yyyy年mm月dd日  需要修改两个地方: 1、更改datas对象, 增加zh-cn语言选项;参见源代码的1419行 var dates = $.fn.datepicker.dates = { en: { days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"], daysShort: ["Sun", "Mo

bootstrapTable语言包设置

2019独角兽企业重金招聘Python工程师标准>>> ...

weixin_34010949的博客 3631

将bootstrap-table表格翻译为中文

1、使用boostrap-table,表格为英文,使用此js翻译为中文。 2、免费下载,希望大家爱上学习。 3、后面会出一个boostrap-tableb表格的简单使用。

【Qt笔记】1.VSCode搭建Qt运行环境

Qt6之后已经抛弃qmake,使用cmake。cmake相对qmake来说只有优点没有缺点。使用VSCode搭建完Qt的运行环境就能开开心心debug了.vscode需要使用的插件:2.Qt tools3.CMakec++插件可以不关注,缺啥都会提醒你.正常安装即可。

没有手牌的博客 2万+

bootstrap table 多行表头高度及导出时日期格式

使用到的相关js <script src="../../js/bootstrap-table/bootstrap-table.min.js" type="text/javascript"></script> <script src="../../js/bootstrap-table/bootstrap-table-mobile.min.js" ty...

yzy85的专栏 1033

003:大疆智图新手入门:从下载安装到首次建模实战

本文为大疆智图新手提供从下载安装到首次三维建模的完整实战指南。详细介绍了软件安装的硬件要求、试用许可申请流程,并指导用户如何准备航拍数据或使用开源样例进行首次建模。通过分步操作演示与核心参数设置讲解,帮助初学者快速掌握使用大疆智图进行实景三维重建的核心流程与常见问题解决方案。

t8u9v0的博客 702

bootstrap-table分页

首先引用css: <link rel="stylesheet" type="text/css" href="css/bootstrap.css" /> <link rel="stylesheet" type="text/css" href="css/bootstrap-table.css" /> 接着接引js: <script src="...

weixin_30672295的博客 177

UE5游戏逆向实战:用FModel提取.pak文件中的3D模型(附Dumper-7避坑指南)

本文详细介绍了在UE5游戏逆向工程中使用FModel提取.pak文件中3D模型的实战技巧,包括Dumper-7工具的深度配置与避坑指南。针对UE5特有的unversioned属性系统,提供了从源码编译到智能注入的全链路解决方案,帮助开发者高效获取游戏资产并优化处理流程。

weixin_30374009的博客 496

DeepSeek Harness接入QQ实战:把DSH变成赛博群友

大模型应用正从单机问答走向多平台集成,如何将模型能力嵌入即时通讯工具成为工程实践的热点。消息接入、会话管理、插件扩展是构建智能群聊机器人的核心三要素。DeepSeek Harness(DSH)作为一款模型会话工作流管理工具,凭借多会话管理、模型调用编排以及灵活的插件机制,能够在QQ群聊场景中实现“接收消息→模型生成→回复推送”的完整闭环。本文从基础概念切入,详解DSH接入QQ的两种实现路线——外部API转发与原生插件适配,覆盖环境准备、启动调试、接口调用与性能观察,并给出常见问题排查清单。无论是本地AI助理

weixin_27427619的博客 1954

html表格合并中文乱码,bootStrap-table这个插件加载从服务器返回的数据中文会乱码...

bootStrap-table加载从服务器返回的数据,中文会乱码?这是表格初始化的代码****其实上面都没有疑问都是对的!动态创建列代码请求后台数据也是中文的到了前端这是返回的javaBeanpublic class VideoChildTableModel {private String id;private String name;private double length;private i...

weixin_42550750的博客 259

【Windows】 解决联想为主的所有自带摄像头(integrate camera)打不开的毛病(特别点名小新、thinkbook、thinkpad、y7000...)

解决联想系列电脑打不开自带摄像头的问题

Iamruzi的csdn博客 3万+

bootstrap的table表格使用

bootstrap的table表格使用(分页查询、条件查询) 先要下载bootstap-table插件包 http://download.youkuaiyun.com/detail/zhangyabin86/9748534将插件的jar包引入到工程中,并通过src导入到本地的项目里 <!--css样式--> <link href="css/bootstrap/bootstrap.min.css" rel="s

qq_34639724的博客 1361

大数据架构中的数据治理:元数据管理与数据血缘追踪实践

本文将聚焦大数据架构中数据治理的两大核心支柱——元数据管理与数据血缘追踪元数据管理的目标、类型与实施步骤(从需求分析到工具落地);数据血缘追踪的技术实现(静态解析、动态捕获、混合方案)与应用场景;如何将两者结合,构建完整的数据治理体系,并通过真实案例展示落地效果。元数据管理:定义了业务/技术/操作元数据,讲解了工具选型(如Apache Atlas)、采集(Hook/API)、存储(关系库+图数据库)、应用(数据发现、质量监控);数据血缘追踪。

欢迎来到我的优快云空间!这里聚焦AI大模型应用实战,分享前沿技术、实战案例与开发经验。 868

【车联网】Automotive 软件过程能力成熟度模型——ASPICE标准入门介绍

ASPICE标准详细定义了与汽车电子软件开发相关的各种术语和概念,包括软件组件、系统集成、测试和验证等。这些定义确保了所有开发团队在使用相同术语时具有一致的理解。

奶爸的编程之路,也就一周冷个三天 2679

Bootstrap Table API 中文版 说明文档

/* * *$('#table').bootstrapTable({}); *看网上有中文版的,但有些就是字面直接译过来了,而且有的就没有翻译,那就打算自己再翻译一遍,每一条会尽 *最大可能结合尽可能多资料翻译,如果发现译的内容比英文多,是添加了更详细的说明,表的名称,属性,类型, *默认值不翻译,例如:"class"、"id"等不翻译。 *有错请提出,会及时改正,谢谢。 *Bootstrap t...

yapengliu的博客 7万+

yolov5直接调用zed相机实现三维测距(python)

zed代码比较简洁,但是一定要把环境配置好,后续自己会把他当做普通双目标定,去对比分析效果,并完善相关功能。

积极向上的mr.d的博客 1万+

no matching records found js组件bootscrapt

如何设置成中文显示 在table标签中加入属性:data-locale=“en-US” <table id="table" data-locale="en-US"> </table> 在js加载table中的数据时:加入locale: ‘en-US’ $('#table').bootstrapTable({ locale: 'en-US' }) 也可以引用: bootstrap-table-en-US.js 、bootstrap-table-zh-CN.js

weixin_43965881的博客 1958

efm32 入门.pdf

本PDF共计22页,介绍的是操作驱动API,下载与否自己斟酌。

IDEA的使用指南

IDEA基于java的使用手册,可以最快速的上手,在使用中不断的丰富自己的使用技巧.

Bootstrap Table 数据导出格式定制:CSV/Excel 样式自定义

你是否遇到过这样的问题:使用 Bootstrap Table 导出数据时,CSV 文件编码混乱导致中文乱码?Excel 导出格式单调无法突出关键数据?导出文件总是包含不必要的操作列?本文将系统解决这些问题,通过 10+ 代码示例详解 CSV/Excel 导出的全流程定制方案,帮助开发者实现企业级数据导出需求。 读完本文你将掌握: - CSV 编码转换与字段分隔符自定义 - Excel 单元格样式...

gitblog_00769的博客 391

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

jquery插件

bootstrap-table: 设置中文 <script type="text/javascript" src="bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script> 修改传递参数 queryParams: function (params) { retur...

weixin_30341735的博客 122

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

BootStrap-table教程

BootStrap-table官网下载地址:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 1、head引入link、js资源 <!-- 引入bootstrap样式 --> <link href="https://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css...

辛聪明的博客 358

bootstraptable 服务端分页问题

折腾了将近一周 终于分页好了 无语 先写下来 怕后面又忘了 前台写js时有几个点要注意: 1.contentType要设为application/x-www-form-urlencoded//这里随意吧 试了下 json也是可以的 json会使得后台取值出现问题 需要把参数格式化下 2.queryParamsType设为''(为了方便,前台直接传pagesize就好)//写到后面 写烦了 直...

weixin_33896069的博客 144

bootstrapTable Post请求传参中文乱码

bootstrap-table Post请求传参中文乱码

qq_40881285的博客 1346

Bootstrap Table API 中文版(完整翻译文档)

表格参数Edit on GitHub     表格的参数定义在 jQuery.fn.bootstrapTable.defaults。           名称 标签 类型 默认 描述 - data-toggle String 'table' 不用写 Jav...

林逗哥 1014
上一篇: ag-grid setRowData重新设置表格行数据
logspool
博客等级 码龄9年 2粉丝 10原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值