[JavaScript] 行を追加したらDatePickerが動かないときー

JavaScript

テーブルに行を追加することってよくあると思います。

追加した行にDatePickerが動かなかったり、他のjQueryが発火しない!!!!

しばらくてんぱった時のメモ

$("#addCol").click(function () {
    var count = $("#Table tbody").children().length;
    $("#noticeTable").append(`<tr>
                    <td class="align-middle text-center"><input id="input` + count + `"  ></td>
                    <td class="align-middle"><input  type="text" class="form-control datepicker validate[condRequired[],custom2024/03/28] "  /></td>
                    <td class="align-middle"><textarea  maxlength="200" class="form-control validate[condRequired[],maxSize[200]] areaHeight "></textarea></td>
                    <td class="align-middle"><input  type="text" maxlength="40" class="form-control  validate[condRequired[],maxSize[40]] "  /></td>
                </tr>`);
});

こんな感じで行追加のボタン押したら行が増えていくようにしてあげます。

もともと表示されている行と同じなのに、DatePickerが動かない!!

ってなりました。

なので

$(".datepicker").datepicker(datepickerOption);
$(".datepicker").attr('readonly', true);

さきほどのソースにDatePickerを動かすおまじないを追加すればOK
(各々でどこかに書いてあるはずなので持ってくればおk)

これで一段落・・・

コメント

タイトルとURLをコピーしました