동적생성된 table input에 datepicker 적용하는 방법

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!
동적생성된 table input에 datepicker 적용하는 방법

QA

동적생성된 table input에 datepicker 적용하는 방법

본문

클릭이벤트로 동적으로 생성된 input에 datepicek가 적용이 되지 않는

문제가 발생하여 글을 올리게 되었습니다.

구글링을 통해 동적으로 생성된 html에 datepicker를 적용하는 찾아

테스트 해보았는데

row 1개만 생성 후 datepicker 컬럼을 클릭하면 달력이 잘 출력이 되는데

여러줄을 생성 후 2번째row, 3번째 row의 datepicker 컬럼을 클릭하면

포커스가 가장 맨윗줄 row의 datepicker에 포커스가 잡히면 날짜를 클릭하면

맨 윗줄 row에만 데이터가 들어갑니다.

어떤 부분을 수정해야 각 row datepicker 컬럼마다 달력 데이터가 들어갈수 있게 할수 있을까요?

$(아이디).click(function(e){
  e.preventDefault();
    
       $(".table .r:last").clone(true);
        $(".table .r:last").after(new_tr);
       $(".table .date-picker").datepicker();
});
 
<table class="table">
<tr class ="r">
  <th><input type="text" name="test"></th>-row1
  <th><input type="text" name="test"></th> -row2
</tr>

이 질문에 댓글 쓰기 :

답변 1

datepicker를 적용할 input에 class="datepicker" 추가

동적으로 생성된 input에서도 아래처럼 datepicker 실행할 수 있습니다.

$(document).on("click", ".datepicker", function () {
    $(this).datepicker().datepicker("show");
});
------------

답변을 작성하시기 전에 로그인 해주세요.
전체 124,448 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT