多个jquery-ui日期选择器

Question

所以这是我的问题：我正在构建一个表单构建器。这当然允许用户在构建时“预览”他的表单。包括添加datepickers（目前它只是以div为目标并激活它）

代码：

$('#'+name).datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange: "1900:2050"
});             

当我需要“重建”表单进行编辑时，问题就出现了。我想提供相同的功能，基本上他们会看到一个现场“工作”版本，如果你愿意的话。这可以在您将其添加到页面时起作用，但重新绑定可能是一个问题。见下文。

我尝试了几件事：

- 在课堂上加载时初始化：

$(function(){    $('.class-name').datepicker(); });

当您稍后在页面中添加日期选择器时，这当然不起作用。

我知道你在想什么，只是用类来初始化那些，然后在添加它们时单独初始化它们。不幸的是，他们似乎没有这样的工作。

我尝试了，初始加载初始化它们的页面。然后，如果添加了新的，我就这样做了：

$('.datepickers').each(function(i,el){
            $(el).datepicker( "destroy" );
            $(el).datepicker(); 
        });

看看它是否有用。似乎什么都没有。有什么想法吗？

修改 当我向表单添加新的日期选择器时，这是添加的HTML

<div id="asdas-block" class="datepicker-wrapper form-input-wrapper">
        <div class="template-drag-handle"><img src="images/design/up-down-icon.png" class="template-drag-handle-icon" alt="Drag"></div>
        <div class="inputs-wrapper">
            <div class="form-row"><input type="text" name="asdas" class="input-datepicker hasDatepicker" placeholder="asdas" id="asdas"></div>
        </div>
        <div class="options-wrapper">
            <div class="required-chkbox options-chkbox-wrapper"><input type="checkbox" value="1" name="asdas_required" id="asdas_required" {required}=""></div>
            <div class="public-chkbox options-chkbox-wrapper"><input type="checkbox" value="1" name="asdas_public" id="asdas_public" {public}=""></div>
            <div class="searchable-chkbox options-chkbox-wrapper"><input type="checkbox" value="1" name="asdas_searchable" id="asdas_searchable" {searchable}=""></div>
            <div class="searchable-chkbox options-chkbox-wrapper"><input type="checkbox" value="1" name="asdas_searchable" id="asdas_published" {published}=""></div>
            <div class="delete-btn options-chkbox-wrapper"><a href="javascript:;" class="removeInput" data-remove-elm="asdas"><img src="/images/design/circle-close-icon.png" class="remove-field-icon" alt="Delete"></a></div>
        </div>  </div>  

注意：asdas是给出示例的“名称”。当试图做$('#asdas').datepicker()时没有任何事情发生。

如果我再次尝试完成整个input-datepicker课程，那么什么也没发生。

Photo只显示了一个工作日期选择器（使用classname方法。而且新输入似乎添加了“hasDatepicker”类，即使它似乎不起作用。