克隆html - datepicker

时间:2016-04-28 08:58:46

标签: javascript jquery html datepicker clone

我遇到了克隆datepicker的问题。我的脚本不起作用,但我不知道为什么。我尝试添加下一个(克隆)表单的一部分。你能帮帮我吗?谢谢。

JSfiddle:https://jsfiddle.net/mart01/8947uhrc/10/

HTML:

<form action="" id="myForm">
          <div id="cosponsors" style="padding:12px;">
        <div class="form-group">
      <label class="col-md-3 control-label" for="textinput">Date</label>  
      <div class="col-md-8">
      <input name="date" id="datepicker" value="DD.MM.YYYY" class="form-control input-md">
      </div>
      <div class="form-group">
      <label class="col-md-3 control-label" for="textinput">Your tip</label>  
      <div class="col-md-8">
      <input id="textinput" name="tip" type="text" placeholder="win / lose" class="form-control input-md">
      </div>
    </div>
    </div>
          </div>
         </form>
        <input type="button" class="addRow" value="Add Next" />

脚本:

 $(function() {
  $( "#datepicker" ).datepicker({
    dateFormat: 'dd.mm.yy',
    firstDay: 1,
    minDate: new Date(), // = today
    });
});


var uniqueId = 1;
$(function() {
     $('.addRow').click(function() {

         var copy = $("#cosponsors").clone(true).appendTo("#myForm");
         var cosponsorDivId = 'cosponsors_' + uniqueId;
         copy.attr('id', cosponsorDivId );




          var deleteLink = $("<a>delete</a>");
             deleteLink.appendTo(copy);
             deleteLink.click(function(){
                 copy.remove();
             });

             $('#myForm div:last').find('input').each(function(){
                $(this).attr('id', $(this).attr('id') + '_'+ uniqueId); 
                $(this).attr('name', $(this).attr('name') + '_'+ uniqueId); 

             });

             uniqueId++;  
         });
    });

2 个答案:

答案 0 :(得分:1)

您正尝试使用jquery / class(。)访问datepicker而不是使用id(#)

类选择器 - &gt;

 $( ".datepicker" ).datepicker({
        dateFormat: 'dd.mm.yy',
        firstDay: 1,
        minDate: new Date(), // = today
        });
    });

id选择器 - &gt;

 $( "#datepicker" ).datepicker({
        dateFormat: 'dd.mm.yy',
        firstDay: 1,
        minDate: new Date(), // = today
        });
    });

答案 1 :(得分:0)

将所有Jquery代码放在$(document).ready()中,然后尝试执行它