时间戳

首页 > 解决方案 > 使用引导表扩展行后初始化元素

jquery - 使用引导表扩展行后初始化元素

问题描述

我正在使用 bootstrap-table.com 创建一个表。有些行可以用expand-row.bs.table 扩展。不幸的是，在扩展它们之后，我无法操作扩展区域中的任何元素。

例如我尝试设置输入字段的值：

$table.on('expand-row.bs.table', function(e, index, row, $detail) {
    var res = $("#desc" + index).html();
    $detail.html(res);
    // set input text
    $('#inputTimetator1').val('input test text');
});

后来我想在展开隐藏区域的时候初始化一些select2。关于如何初始化这些项目的任何想法？

JSfiddle

标签： jquerybootstrap-4

解决方案

它无法更改$detaildom 元素，因为您尝试使用多个没有父元素或根元素的 dom 元素对其进行设置，因此为了使可扩展行被操纵，您必须用包裹在一个根 dom 元素中的 dom 元素填充它像 div 或 span 并确保仅设置您在已更改的可扩展行中找到的第一个输入

只需将您的代码更改为此，它就可以正常工作

$table.on('expand-row.bs.table', function(e, index, row, $detail) {
    var res = $("#desc" + index).html();
    $detail.html('<div>' + res + '</div>');
    $detail.find('input').val('input test text');
});

这是一个jsfiddle链接。

推荐阅读