のりべーす
今更ですが、jqueryのcloneメソッドは、ブロック単位で一括コピーするのに便利ですが、 イベント処理が有る場合は、注意が必要です。
(jQuery)要素にイベントを設定する際、"clone(true)"に備える。 – すたら日記
にあるように、使用する要素は、
単純に$(‘.class1’)や$(‘#id1’)等で要素を取得操作していると、clone元の要素を取得してしまい、
正しい挙動になりません。
その為、$(this).parent等を使って、thisからたどっていく形で、要素を取得する必要があります。
datepickerも上記が原因かは、ソースを見てないのでわかりませんが、 cloneすると、正常に稼働しなくなります。
調べてみると、
clone.removeClass("hasDatepicker") // classを削除
.removeData("datepicker") // 関連づけられたデータを削除
.removeAttr("id") // idも削除
.unbind() // 関連づけられた関数を削除
.datepicker(); // datepickerを再設定
引用:【jqueryui】datepickerしたinputのclone at softelメモ
上記の方法で正常にcloneできるようですが、 実際にはclassとidの .removeClass(“hasDatepicker”) .removeAttr(“id”) 削除処理は実行しなくても正常稼働するようです。
ただ、id自体が重複してしまうので重複しないIDを設定しなおすか元々IDを設定しないのが正しいかもしれませんが、 ブロック単位でcloneした場合は
clone.find('.datepicker').removeData("datepicker")
.unbind()
.datepicker({
format: 'yyyy/mm/dd',
language : 'ja'
});
