typescript - 如何修复引导表中的页脚值?
问题描述
我正在研究带有页脚和排序的引导表。一切正常,但在尝试将排序重置为默认值后,我的页脚总和设置为 0。
我在调用 $table.bootstrapTable('destroy') 后尝试重新加载表格或编辑页脚,但没有任何变化。
默认排序功能:
setDefaultSorting() {
let $table = this.getTable();
//Remove sorting cookies, to delete saved sorting. 'getCookies' method will return current cookies
$table.bootstrapTable('deleteCookie', 'sortOrder');
$table.bootstrapTable('deleteCookie', 'sortName');
//Recreate the table to remove current sorting
$table.bootstrapTable('destroy');
this.bootstrap(this.data);
}
bootstrap ir 调用 $table.bootstrapTable() 的函数:我已删除列以提高可读性
public bootstrap(data) {
this.data = data;
let $table = this.getTable();
let id = this.id;
$table.bootstrapTable({
toolbar: '#toolbar',
sortable: true,
search: true,
pagination: true,
fixedColumns: true,
pageSize: 10,
pageList: [5, 10, 15],
paginationPreText: "‹",
paginationNextText: "›",
classes: "table table-hover",
columns: [
],
data: this.useDefaultSorting(data), //When bootstrapping data on landing page, always use default sorting
cookie: true,
cookieIdTable: id
});
$table.on('sort.bs.table', (_e: any, _column: string, order: string) => {
RMLandingPageTable.sortOrder = order;
});
$table.on('editable-save.bs.table', function (_e: any, column: any, row: IRMLandingPageGroup, _old: any, _$el) {
var isRM = column === 'rmFreeText';
var role = isRM ? ERole.RelationshipManager : ERole.CreditEmployee;
var text = isRM ? row.rmFreeText : row.creditFreeText;
RMLandingPageTable.freeTextChange.emit({ globalCustomerId: row.mainGlobalCustomerId, text, role });
});
// maxlength is not an option of x-editable, the following is a workaround for setting it to 20
$table.on('editable-shown.bs.table', function (_e: any, _column: any, _row: any, _old: any, _$el) {
$('.bootstrap-table-editable-cell input').attr('maxlength', 20);
});
this.calculateTotals(data);
//I'm so sorry, needed for displaying the filter drop down when no results are in the table
$(".bootstrap-table").css({ "min-height": this.minHeight });
}
这是计算总数的函数:
private calculateTotals(data) {
let exposureString: string;
var total = Formatter.exposureFormatter(this.sum(data, exposureString)));
var span = 7;
this.footer = {
columns: [
{ title: "", span: span, dataField: "" },
{ title: "Total:", span: 1, dataField: "totalTitle", align: "right" },
{ title: total, span: 1, dataField: "total", align: "left" }
]
};
一切正常,除非我第二次尝试调用默认排序,否则总显示为 0。但是,在调试中我可以看到, this.footer 设置了正确的值。
可能是什么问题?
谢谢!!
解决方案
问题与 BootstrapTable 有关。在初始化时,我正在创建显示零的临时页脚。在创建实际表后,我用真正的页脚覆盖它,该页脚在 Destroy 事件期间被删除。你不能在不破坏自定义页脚的情况下破坏表格。解决方法是在销毁之前复制页脚,并在使用 jquery 重新创建后附加回来。
推荐阅读
- kubernetes - 如何从 pod 创建秘密/共享数据?
- java - 在 SpringBoot 客户端中使用 WebServiceTemplate 调用 SOAP Web 服务
- powershell - 如何逐步显示控制台日志?
- php - 使用 CURL POST (PHP) 登录到另一个站点
- amazon-cognito - Cognito 用户池可以通过另一个 Cognito 用户池登录吗?
- excel - 数据点之间的时间差增加
- amazon-dynamodb - 使用 DynamoDB 和 Boto3 进行乐观锁定的 Upsert
- java - Flyway 发现多个版本的迁移
- java - 即使使用 Long 类型,整数也太大
- ios13 - ios13/Xcode11:UISearchController 的 searchResultsController 不再是模态的?