douzhi3776
2014-10-02 16:35
浏览 39

克隆行上的jquery Datepicker

im using the Datepicker that comes with jquery...

new.php

<html>
<table id="testtable">
<tr id="table_row1">
<td><input type="text" name="date[]" class="pickDate"></td>
<td><?php ...some php stuff here...?> </td>
</tr>
</table>
<label onclick="cloneRow('testtable','table_row1')"></label>
</html>

index.php

<html>
<php
include('new.php')
?>
<script>
$(document).ready(function() {
$('.pickDate').each(function() {
    $(this).datepicker({ dateFormat: 'dd.mm.yy' });
});
});
</script>
</html>

javascript function for cloning:

function cloneRow(tablename,rowname) {
var row = document.getElementById(rowname); // find row to copy
var table = document.getElementById(tablename); // find table to append to
var clone = row.cloneNode(true); // copy children too
clone.id = "newID"; // change id or other attributes/contents
table.appendChild(clone); // add new row to end of table
}

So the problem is, on the first row, the datepicker is there, and works, but if i clone the row, the cloned one has no datepicker.

I checked if the class gets cloned too, and yes it does.

Im very new to jquery, but does jquery maybe not notice that there has been added a new row?

How can i get this to work?

图片转代码服务由CSDN问答提供 功能建议

我正在使用jquery附带的Datepicker ...

new.php

 &lt; html&gt; 
&lt; table id =“testtable”&gt; 
&lt; tr id =“table_row1”&gt; 
&lt;  ; td&gt;&lt; input type =“text”name =“date []”class =“pickDate”&gt;&lt; / td&gt; 
&lt; td&gt;&lt;?php ...这里有一些php的东西......?  &GT;  &lt; / td&gt; 
&lt; / tr&gt; 
&lt; / table&gt; 
&lt; label onclick =“cloneRow('testtable','table_row1')”&gt;&lt; / label&gt; 
&lt; / html&gt; 
    
 
 

<强>的index.php

 <代码>&LT; HTML&GT; 
&LT; PHP中
include(  'new.php')
?&gt; 
&lt; script&gt; 
 $(document).ready(function(){
 $('。pickDate')。each(function(){
 $(this  ).datepicker({dateFormat:'dd.mm.yy'}); 
}); 
}); 
&lt; / script&gt; 
&lt; / html&gt; 
   \  n 
 

用于克隆的javascript函数:

  function cloneRow(tablename,rowname){
var row = document.getElementById(rowname);  //找到要复制的行
var table = document.getElementById(tablename);  //找到要附加到
var clone = row.cloneNode(true)的表;  //复制儿童
clone.id =“newID”;  //更改id或其他属性/内容
table.appendChild(clone);  //将新行添加到表的末尾
} 
   
 
 

所以问题是,在第一行,datepicker就在那里,并且有效,但如果我 克隆行,克隆的行没有datepicker。

我检查了这个类是否也被克隆了,是的。

我对jquery很新,但是jquery可能没有注意到添加了新行吗?

我怎样才能让它工作 ?

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • duan1989643 2014-10-02 17:05
    已采纳

    The problem here is that the code that applies the plugin is only ever run once, at page load. You'll need to apply the plugin each time you clone a node. Also, since you already have jQuery around, I modified the code to use jQuery to manipulate the elements.

    function cloneRow(tablename,rowname) {
      var row = $("#" + rowname); // find row to copy
      var table = $("#" + tablename); // find table to append to
      var clone = row.clone(); // copy children too
      clone.attr("id", "newID"); // change id or other attributes/contents
      table.append(clone); // add new row to end of table
      clone.children(".pickDate").datepicker({ dateFormat: 'dd.mm.yy' });
    }
    
    打赏 评论

相关推荐 更多相似问题