내용 입력창에 달력을 여러개 넣고싶습니다.
본문
안녕하세요.
하단버튼을 추가하면 테이블이 하나씩 늘어나는 소스입니다.
그런데 추가되는 input 에 클릭하면 달력을 넣고싶어 아래처럼 만들었는데요.
스크립트에 완전 문외한이라ㅠㅠ 숫자증가만 시켜주면 될거같은데 도통 방법을 모르겠네요.
그러니까
sigan[]
이걸
sigan_1
sigan_2
sigan_3
이런식으로 추가되게 하면 될거같은데...
어떻게 해야하나요. 도와주세요ㅜㅜ
<div class="form-group">
<label for="wr_2" class="col-sm-3 control-label">오픈일정</label>
<div class="col-sm-5">
<div style="margin-bottom:5px;">
<input type="button" id="btn-add-row" value="추가하기">
<input type="button" id="btn-delete-row" value="삭제하기">
</div>
<script>
$(function () {
$('#btn-add-row').click( function() {
$('#mytable > tbody:last').append('<tr><td><input type="text" class="form-control" required id="sigan[]" name="sigan[]"/></td><td><input type="text" id="sebu[]" name="sebu[]" class="form-control" placeholder="세부사항"></td></tr>');
$("#sigan[]").datepicker({ changeMonth: true, changeYear: true, dateFormat: "yy-mm-dd", showButtonPanel: true, yearRange: "c-99:c+99", minDate: "+0d;", maxDate: "+30d" });
});
$('#btn-delete-row').click( function() {
$('#mytable > tbody:last > tr:last').remove();
});
});
</script>
<table id="mytable" class="table table-bordered">
<thead>
<tr>
<th style="width:20%;">날짜</th>
<th>세부사항</th>
</tr>
</thead>
<tbody>
<?if($wr_id){?>
<?
$cnt = count($sigan);
?>
<?for($i=0; $i<$cnt; $i++){?>
<tr>
<td><input type="text" name="sigan[]" id="sigan[]" value="<?php echo $sigan[$i];?>" class="form-control"></td>
<td>
<input type="text" id="sebu[]" name="sebu[]" value="<?php echo $sebu[$i];?>" class="form-control" placeholder="내용" style="width:100%;">
</td>
</tr>
<?}?>
<?}?>
</tbody>
</table>
</div>
</div>
답변 2
datepicker$(
".
"
).datepicker({ changeMonth: true, changeYear: true, dateFormat:
"yy-mm-dd"
, showButtonPanel: true, yearRange:
"c-99:c+99"
, minDate:
"+0d;"
, maxDate:
"+30d"
});
<input type=
"text"
id=
"sebu[]"
name=
"sebu[]"
value=
"<?php echo $sebu[$i];?>"
class
=
"form-control datepicker"
placeholder=
"내용"
style=
"width:100%;"
>
해결 했습니다. ㅜㅜ
<script>
$(function () {
var file_num = 1;
$('#btn-add-row').click( function() {
file_num++;
$('#mytable > tbody:last').append('<tr><td><input type="text" class="form-control" style="width:100%;" required id="sigan_'+file_num+'" name="sigan[]"/></td><td><input type="text" id="sebu[]" name="sebu[]" class="form-control" placeholder="내용" style="width:100%;"></td></tr>');
$('#sigan_'+file_num+'').datepicker({ changeMonth: true, changeYear: true, dateFormat: "yy-mm-dd", showButtonPanel: true, yearRange: "c-99:c+99", minDate: "+0d;", maxDate: "+30d" });
});
$('#btn-delete-row').click( function() {
$('#mytable > tbody:last > tr:last').remove();
});
});
</script>
답변을 작성하시기 전에 로그인 해주세요.