애니빌드.LAB
토론방
소스관련 맞춤전송폼 달력창사이즈 문의드립니다.
- v**vajet
- 2016-12-07 16:53:50
- hit3709
- http://lab.anybuild.co.kr/bbs/qna/6512
맞춤전송폼을 사용중에 있습니다.
맞춤전송폼의 입력폼중에 달력설정을 사용중입니다.
실제 적용되는 화면에서 입력폼의 사이즈가 좁아서 전체 날짜의 표기가 불가한 상태입니다.
위 사이즈 조정을 진행하기 위하여 어느부분을 수정진행하여야 하는지 문의 드립니다.
위 계정외에 여러곳의 계정의 수정이 필요합니다.
어느부분을 수정해야하는지 알려주시면 별도의 계정은 알려주신내용으로 저희가 처리진행하도록 하겠습니다.
게시글 공유
URL복사
댓글작성
열기 닫기
열기 닫기
달력부분의 내역 변경은 몇군데를 수정을 해야됩니다.
맞춤전송폼 소스 자체를 수정을 하는것인데 현재 어떠한 값으로 구성이 되어있는지를 먼저 파악을 해야됩니다.
먼저 홈페이지에서 소스보기를 클릭합니다.
현재 달력이 사용일이니까 사용일로 검색을 하면 간단히 내역을 확인을 할 수 있습니다.
위의 소스에서 아래의 두부분을 변경을 해야됩니다.
<input type='text' name='s_v3' value='2016-**-****; id='datepicker_s_v3' style='width:90px' >
아이디는 날짜컨트롤을 위한 내역이고 스타일을 달력선택 사이즈를 느리기 위한 내역입니다.
str_replace라는 문자열 치환으로 처릴르 합니다.
관리자 페이지 프로그램 샵 > 프로그램 환경설정 > 맞춤 전송폼 설정에서 기본디자이을 선택합니다.
그리고 작성 폼화면에서 내역을 추가를 해야됩니다.
소스중 이부분을 먼저 수정을 합니다.
<!--@foreach($myreg_form_row as $k => $v)-->
<table class="pl-formTable">
<caption class="pl-caption">{$v[subject]}</caption>
<tbody>
<!--@foreach($v[fields] as $k2 => $v2)-->
{@
$v2[fieldTag] = str_replace("datepicker_s_v3", "datepicker_s_v3_2", $v2[fieldTag]); // 달력표시 아이디 변경
if(!$mobile_conn_yn) {
$v2[fieldTag] = str_replace("name='s_v3'", "name='s_v3' readonly", $v2[fieldTag]); // 달력부분 읽기전용으로 처리
}
$v2[fieldTag] = str_replace("style='width:90px'", "style='width:120px'", $v2[fieldTag]); // 달력부분 사이즈 늘림
@}
<tr>
<th>{$v2[fieldName]} <span class="important" cond="$v2[fieldImportant]==1">*</span></th>
<td>{$v2[fieldTag]} <span class="comment" cond="$v2[fieldComment]">{$v2[fieldComment]}</span></td>
</tr>
<!--@end-->
</tbody>
</table>
<!--@end-->
위의 빨간색 부분을 추가를 합니다
그리고 해당 페이지 제일 마지막에 아래의 스크립트를 추가합니다.
<script type="text/javascript">
$(function() {
var clareCalendar2 = {
monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
dayNamesMin: ['일','월','화','수','목','금','토'],
weekHeader: 'Wk',
dateFormat: 'yy-mm-dd', //형식(2012****)
autoSize: false, //오토리사이즈(body등 상위태그의 설정에 따른다)
changeMonth: true, //월변경가능
changeYear: true, //년변경가능
showMonthAfterYear: true, //년 뒤에 월 표시
yearRange: '1930:2050**;, //1990년부터 202*년까지
minDate: '+2d',
maxDate: '+7200d'
};
$( '#datepicker_s_v3_2' ).datepicker(clareCalendar2);
})
</script>
달력부분의 새로운 스크립트입니다.
minDate가 +2d라고 되어있는데 이 부분이 핵심입니다. 2일뒤에 선택이 가능하도록 하는 부분입니다.
위의 내역만 알고계시면 다른 사이트에도 적용을 하실 수 있습니다.