게시판
이 스킨(팁)은 더 이상 다운로드 받으실 수 없습니다^^ 기능이 업그레이드 되어서, 구버전인 이 스킨(팁)은 삭제되었습니다
[펄스나인] 쉽게쓰는 UI/UX - Datepicker (한글달력)
작업중에 구현했던 부분 공유 드립니다~
JQuery UI 에서 지원하는 Datepicker 의 한글적용 및
스타일 변경입니다.
첨부된 파일 압축푸셔서 index.php 파일 안의 내용 복붙 하시면 되겠습니다.
편의상 style 은 문서안에 포함시켰고,
JS 및 CSS 파일 호출되는 부분 아래에 style 넣어주시면 적용 됩니다.
파일내 background-image: url('./btns.png'); 부분의 경로는
style 이 들어가는 파일을 기준으로 변경해주시면 되겠습니다.
샘플 Url 있습니다!
감사합니다.
크로스브라우징 : 익스11, 크롬, 엣지, 웨일
버전 정보
테스트한 버전
5.4.3
호환 가능 버전
버전 무관함
첨부파일
|
댓글을 작성하시려면 로그인이 필요합니다.
그누보드5 스킨
좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.
레이아웃
기존 나리야용 간편상담에서 상담등록시 회원과 비회원을 구분하는 옵션과 분류부분을 추가했습니다. 그누보드용 : https://sir.kr/g5_skin/40699 아미나용 : htt...
게시판
안녕하세요, 인스크루입니다. 깔끔한 FAQ 스킨 공유합니다. 필요하신분들은 다운받아 사용해보세요 :)
레이아웃
[code] <?php // 이 함수가 바로 최신글을 추출하는 역할을 합니다. // 사용방법 : latest(스킨, 게시판아이디, 출력라인, 글자수); ...
게시판
페이지 에디터 스킨이 업데이트 되었습니다. 추가된 기능 - dropzone.js 를 통한 파일관리 기능 추가 (그누보드 파일관리 시스템과 연동) ckfinder는 저작권...
레이아웃
작업중에 구현했던 부분 공유 드립니다~ JQuery UI 에서 지원하는 Datepicker 의 한글적용 및 스타일 변경입니다. 첨부된 파일 압축푸셔서 index.php ...
게시판
*** 글 번호와 시간 설정 수정 날짜와 시간 및 분까지 설정 가능합니다. 그럼 해당 시간이 되면 삭제됩니다. 1. 스킨을 skin board에 올립니다. 모바일에도 올립니...
게시판
조립 PC 견적서 게시판입니다. 그누보드4에 있는 스킨 이번에 필요해서 5.4에서 사용할 수 있게 만들었습니다. 견적서 바로 출력가능하구요. 특이사항은 여분필드 53...
게시판
이 게시판도 동일하게 자잘한 오류 수정과 크롬 테스트 수정하였습니다. 크롬에서 머리글 바다글 설정은 인쇄 창에서 인쇄더보기 설정에 있습니다.
게시판
크롬에서 머리글 바다글 설정은 인쇄 창에서 설정 더보기 설정에 있습니다. 5.3버전에서 몇가지 에러 나는 부분이 있어서 수정하면서 크롬에서도 동작 확인하였습니다....
최신글
https://sir.kr/g5_skin/40277 게시판과 같이 쓰셔야 동작 됩니다. 이미지 클릭시 팝업 제목 클릭시 일반 최신글과 동일하게 동작 됩니다. <?php ...
댓글 206개
기본 레이아웃이 좀 투박해서 바꿔봤습니다 ㅎ
감사합니다.
도움이 되신다니 좋네요~ ^^
감사히 쓰겠습니다.
유익한 주말 되십시요~~
혹시 버튼클릭 말고 처음부터 화면에 나오게 할려고 하면 어떻게 해야하나요??
input 에 autofocus 를 추가하시면 될거같습니다~
<input type="text" name="test" class="datepicker inp" readonly="true" autofocus />
페이지로드후 해당 input으로 자동 포커스되어
datepicker 가 활성화 됩니다~
저는 input 없이 바로 달력이 노출되어서 날짜를 선택하고 싶은데 방법이 없을까요?
input을 hidden 으로 숨겨놓고 autofocus 를 추가하면 되지않을까요?
멋진 스킨 감사드립니다 ^^
즐거운 주말 되세요-
감사합니다~
감사합니다
감사합니다.
말씀하시는걸까요?
value="" 에 오늘 날자를 넣어주시면 됩니다 ㅎ;
[code]
<?php
$today = date("Y.m.d");
?>
<input type="text" value="<?php echo $today; ?>" name="">
[/code]
잘 써주십시요~^^
날짜 설정해서 시작날짜 끝는 날짜 선택 후 클릭 버튼을 누르면
그 값이 설정되어 mysql 값을 호출해서 보여지게 할려고 하는데
설명처럼
<!-- 적용은 input에 class="datepicker" 만 추가하시면 됩니다. { -->
이렇게 나와있는데 이 부분을 어떻게 하면 되는건가요?
도움부탁드립니다.
값을 받는 곳은 이렇게 했습니다.
FROM abc WHERE result_date BETWEEN '2021-06-15' AND '2021-06-25'";
조언 부탁드립니다.
<form>
<input value="">
<button type="submit">
</form>
형태로 파라미터로 값을 넘겨서 받아도 될거같습니다~
class="datepicker" 는
input에 클래스로 datepicker 만 추가하시면
캘린더를 사용할 수 있다는 내용 입니다~
추가로 한가지 더 질문드립니다.
처음 시작할때 설정값이 오늘 날짜로 설정되어
첫 페이지 값이 오늘 날짜의 값으로 표시되게 하는 방법도 조언 부탁드립니다.
$today = date("Y.m.d");
?>
<input value="<?php echo $today; ?>">
이렇게 넣어주시면 오늘날짜를 미리 넣어두실 수 있습니다.
답변 너무 감사드립니다.
그런데 제가 너무 초보라서 잘 안되네요.
좀더 도움 부탁드립니다.
[code]
<?php
$username = "username";
$password = "password";
$database = "database";
$mysqli = new mysqli("localhost", $username, $password, $database);
$query = "SELECT SUM(abc) FROM date_report WHERE result_date BETWEEN 'begin_date' AND 'end_date'";
?>
<form>
<div style="width:400px; margin:0 auto; margin-top:100px; text-align:center;">
<input type="text" name="begin_date" value="<?php echo $today; ?>" class="datepicker inp" placeholder="처음날짜" readonly="true" />
<input type="text" name="end_date" value="<?php echo $today; ?>" class="datepicker inp" placeholder="마지막날짜" readonly="true" />
</div>
<button type="submit">
</form>
[/code]
이렇게 만들었는 아래 이미지처럼 날짜는 오늘 현재 날짜로만 고정이 되고 db 값을 못가져 옵니다. ㅠㅠ
그리고 확인하는 버튼 자체가 db 값을 가져오는 전체 테이블이 통으로 버튼이 됩니다. ㅠㅠ
[http://sir.kr/data/editor/2106/32c343609c68f685099d5e59f76450af_1624846952_9771.jpg]
- 페이지 첫 오픈했을때 오늘 날짜로 db 값을 가져오기
- 날짜 설정하면 설정하는 '처음날짜'부터 '마지막날짜' 기간동안 합계 값 가져오기
- 날짜 설정시 과거 날짜가 설정이 안됩니다. 현재 또는 미래 날짜만 설정할 수 있습니다. 저는 과거 날짜 설정이 필요합니다.
어떻게 하면 될까요?
조언 부탁드립니다.
begin_date 와 end_date 로 저장이 되는거같은데
이 값을 value로 넣어주셔야 합니다~
if 문을 사용해서 해당항목의 db에 값이 없을때
echo $today 로 오늘 날짜를 넣어주는게 맞는거같습니다.
예시)
<?php
if($row['begin_date'] == "") {
echo $today;
} else {
$row['begin_date'];
}
?>
그리고 이전 날짜를 선택 할 수 있게 하시려면
달력 스크립트 중
$(".datepicker").datepicker({
//minDate: 0
})
minDate: 0 부분을 위와같이 주석처리 해주시면 되겠습니다.
그리고 나머지 부분은
Q&A게시판이나 제작의뢰로 도움 받으시는것이 맞을것 같습니다 ^^
감사합니다.
잘 써주십시요~! ㅎㅎ
잘 써주십시요 ! ㅎㅎ
잘 써주십시요 ^^
잘 써주셔서 감사합니다~
//minDate: 0
})
minDate: 0 을 주석처리해주세요~~!
날자가 2022.07.06 으로 되는걸 22.07.06 으로 나오게 수정가능한지요?
위부분을
dateFormat: "y.mm.dd",
로 변경해주세요.
감사합니다.
파라미터로 value 값을 넣어주셔도되고,,
선택을 어떻게 하는지를 몰라서 명쾌한 답변이 안될것 같네요 ㅠ
넘 잘만드셨네욥 ㅠㅠㅠ 얼른 사용하고 싶어요 !.. 얼른 포인트 모아오겟습니다...!
ㅎㅎ 금방 모이실거에요 !!
디자인을 잘하신거 같습니다 ㅎㅎ
좋은말씀 감사합니다 !! ㅎㅎ
감사합니다
감사합니다~
잘쓰겠습니다!
감사합니다 잘쓰세요~
감사합니다!
감사합니다!
감사합니다!