Question

我正在使用grails 2.1.1和jquery。我有一张表，每行有三个字段，如审计员，指定和审计日期。所以我声明了一个函数，它将克隆表的最后一行并将其添加为最后一行。现在它正在这样做，但问题是除了日期选择器之外，克隆的选择框和文本字段是可以的。它也克隆了日期选择器但是当我点击它时，它没有显示要选择的日历，但是在它的第一行。我搜索过护目镜并尝试了很多东西，但没有结果。请问有人可以帮我吗？!!!以下是我的代码::

我的表格和操作按钮＆gt;＆gt;＆gt;

<table id="auditors" class="auditors">
        <tr><th>Auditor Name</th><th>Designation</th><th>Audit Date</th></tr>
        <tr>
            <td><g:select id="auditor0" name="auditor0" from="${audit.Auditor.list()}" optionKey="id" optionValue="AUDITOR_NAME" noSelection="['':'নির্বাচন করুন']" required="" value="${upManagementLetterInstance?.upRepresentative?.auditor?.id}" class="form-control"/></td>
            <td><g:textField name="auditorDesignation0" id="auditorDesignation0" readonly="" class="form-control"/> </td>
            <td><div class="bfh-datepicker" id="auditDate0" data-date="${formatDate(format:'MM/dd/yyyy',date:upManagementLetterInstance?.upRepresentative?.auditDate)}" data-close="true" data-name="auditDate0"></div></td>                
        </tr>
    </table>

    <input type="button"  value="Add Another Auditor" onclick="addAnotherAuditor()"/>

我的功能＆gt;＆gt;＆gt;

    <script>
var initialCounter = 0,addedCounter = 1;
function addAnotherAuditor(){
        var row = $(".auditors > tbody > tr:last").clone();
        row.find('select').each(function(){
            this.id= this.name.replace(initialCounter, addedCounter);
            this.name= this.name.replace(initialCounter, addedCounter);
        })
        $(".auditors > tbody > tr:last").after(rows);

        initialCounter++;
        addedCounter++;
    }
</script>

Answer 1

我没有在代码中看到您初始化已克隆的新日期选择器的任何位置。虽然将复制DOM和相关样式，但是附加到原始日期选择器的事件处理程序都不会转移到新的日期选择器。你可以做以下两件事之一：

使用.clone(true)告诉JQuery带来所有相关的事件处理程序（这可能有一些不受欢迎的副作用）
将克隆初始化为日期选择器，就像第一次执行克隆一样，每次都进行克隆。

2是更好的选择。

在jquery中克隆后，Bootstrap datepicker没有显示日历

1 个答案: