Choices JS Re-Initialize 不适用于动态行添加答案

【问题标题】：Choices JS Re-Initialize is not working for dynamic Row addChoices JS Re-Initialize 不适用于动态行添加
【发布时间】：2021-11-01 07:53:15
【问题描述】：

我在 HTML 表格中使用 Choices JS 插件，但是当我通过 jQuery 动态增加表格行时，下一个 Select 不起作用。

在 Document ready 函数中首次使用 -

进行初始化

new Choices('.pdt-name'); --> pdt-name is select field class

当我使用这个向这个表添加新行时 -

    function addRow(table) {
        var x = document.getElementById(table);
        var new_row = x.rows[1].cloneNode(true);
        $('#TableName tbody:last-child').append(new_row);
        new Choices('.pdt-name'); -- Re assigning after New Row added to the table
    }

但只有第一个选择工作休息选择不工作.. 参考表图片 -

提前致谢。

【问题讨论】：

标签： jquery select drop-down-menu jquery-select2

【解决方案1】：

标识符元素必须是唯一的。因此，您必须使用唯一标识符为每一行重新创建一个 Choices 实例：

function addRow(table) {
        var x = document.getElementById(table);
        var new_row = x.rows[1].cloneNode(true);
        var randomID = 'xxx'  //-> Random ID or something else
        new_row.setAttribute('id',randomID);
        $('#TableName tbody:last-child').append(new_row);
        new Choices('#'+randomID);
    }

【讨论】：