시작날짜, 마감날짜를 datepicker 로 입력 받고 있는데.. 채택완료
시작날짜와 마감날짜 입력 여부와
시작날짜와 마감날짜 크기 비교를 체크하는 조건문을 인터넷에서 주워왔어요.
if(s_day == ''){
alert("시작날짜 입력하세요.");
frm.wr_9.focus();
return false;
}
if(e_day == ''){
alert("마감날짜 입력하세요.");
frm.wr_10.focus();
return false;
}
if( Number(s_day.replace(/-/gi,"")) > Number(e_day.replace(/-/gi,"")) ){
alert("마감날짜가 시작날짜보다 빨리올 수 없습니다.");
frm.wr_10.focus();
return false;
}
근데 문제는, 얼럿창 뜨는 타이망과 얼럿창 클릭 후 처리방법입니다.
1.
얼럿창을 클릭하면 기존에 열려있던 데이트피커창이 닫혀야 하는데, 계속 열려 있어서
얼럿창의 확인 버튼 클릭 후 다시 기존 데이트피커 창을 닫고 입력해야 하네요.
2.
시작날짜 , 마감날짜 , 제목, 내용 필드순으로 있다고 가정 시,
시작날짜 얼럿창은
시작날짜 입력 않은 채 (마감날짜 , 제목, 내용)중 하나를 클릭할 때 가장 먼저 뜨게 하고,
마감날짜 얼럿창은
마감날짜 입력 않은 채, 제목 내용 필드를 클릭했을 때 뜨게 하고,
시작날짜와 마감날짜 모두 입력않은 채 제목 내용 필드 클릭 시
시작날짜 얼럿창만 우선 먼저 뜨도록 하고,
시작날짜, 마감날짜 비교는
두 필드가 모두 입력되었을 때 뜨게 하고자 합니다.
좀 어렵죠? ^^
이용할 땐 몰랐는데, 막상 제작 공부 해보니까 상황별 조건 처리가 참 어렵네요.
질문도 질문이지만, 개발하시는 분들 논점 놓치지 마시라고 적어봅니다.
난이도가 있어서 답변은 별 기대하지 않아요. ^^;; 걍,,,,읽어보시라는 의미에서..
답변 1개
Select a Date Range
http://jqueryui.com/datepicker/#date-range">http://jqueryui.com/datepicker/#date-range
가 적절한듯 해보여서 포맷옵션만 바꿔서 올려봅니다.
</p><p><!DOCTYPE html></p><p><html></p><p> <head></p><p> <meta charset="UTF-8" /></p><p> <title>title</title></p><p>
</p><p> <link type="text/css" rel="stylesheet" href="<a href="<a href="http://code.jquery.com/ui/jquery-ui-git.css" target="_blank" rel="noopener noreferrer">http://code.jquery.com/ui/jquery-ui-git.css</a>"><a href="http://code.jquery.com/ui/jquery-ui-git.css" target="_blank" rel="noopener noreferrer">http://code.jquery.com/ui/jquery-ui-git.css</a></a>" /></p><p>
</p><p> <script type="text/javascript" src="<a href="<a href="http://code.jquery.com/jquery.min.js" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery.min.js</a>"><a href="http://code.jquery.com/jquery.min.js" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery.min.js</a></a>"></script></p><p> <script type="text/javascript" src="<a href="<a href="http://code.jquery.com/ui/jquery-ui-git.js" target="_blank" rel="noopener noreferrer">http://code.jquery.com/ui/jquery-ui-git.js</a>"><a href="http://code.jquery.com/ui/jquery-ui-git.js" target="_blank" rel="noopener noreferrer">http://code.jquery.com/ui/jquery-ui-git.js</a></a>"></script></p><p> <script type="text/javascript"></p><p> $( function() {</p><p> var dateFormat = "yy-mm-dd",</p><p> from = $( "#from" )</p><p> .datepicker({</p><p> defaultDate: "+1w",</p><p> changeMonth: true,</p><p> numberOfMonths: 3,</p><p> 'dateFormat': dateFormat</p><p> })</p><p> .on( "change", function() {</p><p> to.datepicker( "option", "minDate", getDate( this ) );</p><p> }),</p><p> to = $( "#to" ).datepicker({</p><p> defaultDate: "+1w",</p><p> changeMonth: true,</p><p> numberOfMonths: 3,</p><p> 'dateFormat': dateFormat</p><p> })</p><p> .on( "change", function() {</p><p> from.datepicker( "option", "maxDate", getDate( this ) );</p><p> });</p><p>
</p><p> function getDate( element ) {</p><p> var date;</p><p> try {</p><p> date = $.datepicker.parseDate( dateFormat, element.value );</p><p> } catch( error ) {</p><p> date = null;</p><p> }</p><p>
</p><p> return date;</p><p> }</p><p> } );</p><p> </script></p><p> </p><p> </head></p><p> <body></p><p>
</p><p><label for="from">From</label></p><p><input type="text" id="from" name="from" /></p><p><label for="to">to</label></p><p><input type="text" id="to" name="to" /></p><p>
</p><p> </body></p><p></html></p><p>
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
고맙습니다. 감사히 잘 쓸게요. ~~~~~~~