UI のdatepickerを使うことになった。
ただ使うだけなら問題ないのだが
元々、入力範囲をcloneしていて、そこにdatepicker の入力テキストを追加することになった。
試したところcloneして表示したものが動作しない。
ネットで探した。

https://www.softel.co.jp/blogs/tech/archives/4426
こちらのサイトに答えが載っていた。

//複製して
var clone = $('あるinput').clone();
//どこかに追加して
$('どこか').append(clone);
//日付入力可能にする
clone.removeClass("hasDatepicker")    // classを削除
    .removeData("datepicker")     // 関連づけられたデータを削除
    .removeAttr("id")             // idも削除
    .unbind()                     // 関連づけられた関数を削除
    .datepicker();                // datepickerを再設定

実際には、text要素だけをコピーするのではなく
ブロックごとコピーするので下記のようにした。

var copy_object = $('#input-block1');
copy_object
    .clone()    //複製
    .hide()
    .insertAfter(copy_object);      // オリジナル要素のあとに挿入
    .attr('id', 'input-block2')     // クローンのid属性を新しいものに変更
    .end()                          // 一度適用する
    .find(',button,table,:text').each(function(idx, obj) {
        // テキスト以外にも検索して要素のIDなど変更

        // datepickerテキスト
        if ($(obj).attr('class') == 'datepicker') {
            // カレンダーアイコンを削除
            $(obj).next(".ui--trigger").remove(); 
            //日付入力可能にする
            clone.removeClass("hasDatepicker")    // classを削除
                .removeData("datepicker")     // 関連づけられたデータを削除
                .removeAttr("id")             // idも削除
                .unbind()                     // 関連づけられた関数を削除
                .datepicker({
                    showOn:'both',
                    buttonImageOnly: true,
                    buttonImage: '/images/ico-calendar.png',
                    beforeShowDay: function(date) {
                        // 日曜日
                        if (date.getDay() == 0) {
                            return [true, 'sunday'];
                        }
                        // 土曜日
                        if (date.getDay() == 6) {
                            return [true, 'saturday'];
                        }
                        // 平日
                        return [true, ''];
                    }
            });
        }
});

var clone = $('input-block2]'); // cloneした要素全体を取得
clone.slideDown('slow');        // cloneをスライドで表示
カテゴリー: Jquery