개발자.. 너란놈..

오랜만에 글을 쓰는 것 같습니다.

원하는 날짜를 입력 후 앞뒤로 1주 전 혹은 2주 후 날짜를 가져와야 하는 문제가 있었는데

아래와 같이 매개변수를 현재 날짜를 입력 받고 전 후로 몇일 만큼 전에있는 데이터를 가져올지 세팅하는 함수입니다.

일 기준으로 되어있기 때문에

한달 단위 , 년 단위는 세팅이 되어있지 않습니다.

vDate는 년월일 세팅 Ex)20210827 or 2021-08-27 

vDiff는 몇일 전 후 세팅입니다 EX) 7 (일주일 후 날짜) , -7 (일주일 전 날짜)

function _fnSetDate(vDate,vDiff) {

    var vValue = vDate;
    var vValue_Num = vValue.replace(/[^0-9]/g, "");

    var rxDatePattern = /^(\d{4})(\d{1,2})(\d{1,2})$/; //Declare Regex                  
    var dtArray = vValue_Num.match(rxDatePattern); // is format OK?

    var dtYear = dtArray[1];
    var dtMonth = dtArray[2];
    var dtDay = dtArray[3];

    var nowDate = new Date(dtYear + "/" + dtMonth + "/" + dtDay);
    var weekDate = nowDate.getTime() + (vDiff * 24 * 60 * 60 * 1000);
    nowDate.setTime(weekDate);

    var weekYear = nowDate.getFullYear();
    var weekMonth = nowDate.getMonth() + 1;
    var weedDay = nowDate.getDate();

    if (weekMonth < 10) { weekMonth = "0" + weekMonth; }
    if (weedDay < 10) { weedDay = "0" + weedDay; }
    var result = weekYear + "-" + weekMonth + "-" + weedDay;

    return result;

}

"/"의 원하는 도메인으로 변경 할 수 있습니다. 

history.pushState(null, null, "/");


//ex) www.naver.com => www.naver.com/Testhaha
history.pushState(null, null, "/Testhaha");

//뒤로가기 이벤트로 왔을 경우 이벤트
if (event.persisted || (window.performance && window.performance.navigation.type == 2) || event.originalEvent && event.originalEvent.persisted) {

}

뒤로 가기로 넘어 왔을 때. 

History back 기능을 사용하기 위해 썼었습니다.

주의 하실 점은 영역이 먼저 잡혀있어야 됩니다. 

(display:none 상태이거나 영역이 잡혀있지 않으면 scrollHeight 길이를 잡을 수 없습니다.)

var vScrollDown = $("#selecter").prop('scrollHeight');
$("#selecter").scrollTop(vScrollDown);

빈 컬럼에 1씩 증가시켜서 데이터를 넣는 방법

UPDATE TABLE명 SET 컬럼명 = ROWNUM

ROWNUM을 이용하여 빈값에 UPDATE를 1씩 증가시켜서 하는 방법입니다.

만약 값이 있는 상태라면, ROWNUM 대신 아래를 참고해주세요.

UPDATE 테이블 명 SET 컬럼명 =  NVL(MAX(컬럼명), 0)+ 1

table을 사용하다 보면 제목? table head 부분을 고정시키고 아래있는 Tbody (Table Body)부분은 스크롤을 만들어서 사용 하고 싶을 떄가 있습니다.

물론 CSS로 조지면 당연히 원하는대로 만들 수 있지만 빠르게 만들어야 하고 CSS도 많이 건들여야 하는 상황에서는 어떻게 해야될까요?

답은 아래에 있습니다.

slimScrollBar API를 사용하면 됩니다.

http://rocha.la/jQuery-slimScroll

https://github.com/rochal/jQuery-slimScroll

심플하게 사용해 볼까요?

아래의 HTML이 있습니다. 

Id는 SlimScrollBar를 위해 만들었습니다.

<div>
	<table>
    	<thead>
        	<tr>
            	<th>행고정</th>
                <th>행고정</th>
                <th>행고정</th>
                <th>행고정</th>
            </tr>
        </thead>
        <tbody id="slimScroll">
        	<tr>
            	<td>Test1<td>
                <td>Test1<td>
                <td>Test1<td>
                <td>Test1<td>
            </tr>
        </tbody>
    </table>

</div>

JavaScript

$('#slimScroll').slimScroll({  
  size : "5px", //스크롤 사이즈
  alwaysVisible: true //항상 보여줄 것인지  
})

이렇게 HTML을 만들고 JavaScript에 SlimScroll을 넣으면 그 해당 영역에는 스크롤이 얉게 생길 겁니다 ㅎ

이 것으로 테이블에 제목 행을 고정하고 내용에 스크롤이 들어가는 API 사용법을 알게 되었습니다.

직접 사이트에 들어가면 slimScroll의 속성들도 많이 있으니 한번정도 읽어보시는게 좋을 것 같습니다.

매개변수의 숫자를 입력하면 현재 날짜에서 +몇일 후 날짜를 가져 올 수 있는 함수.

//매개변수의 숫자만큼 현재 + 입력한 날짜의 YYYY-MM-DD를 리턴 합니다.
function _fnPlusDate(date) {
    var nowDate = new Date();
    var weekDate = nowDate.getTime() + (date * 24 * 60 * 60 * 1000);
    nowDate.setTime(weekDate);

    var weekYear = nowDate.getFullYear();
    var weekMonth = nowDate.getMonth() + 1;
    var weedDay = nowDate.getDate();

    if (weekMonth < 10) { weekMonth = "0" + weekMonth; }
    if (weedDay < 10) { weedDay = "0" + weedDay; }
    var result = weekYear + "-" + weekMonth + "-" + weedDay;
    return 

매개변수의 숫자를 입력하면 현재 날짜에서 -몇일 전 날짜를 가져 올 수 있는 함수.

//매개변수의 숫자만큼 현재 - 입력한 날짜의 YYYY-MM-DD를 리턴 합니다.
function _fnMinusDate(date) {
    var nowDate = new Date();
    var weekDate = nowDate.getTime() - (date * 24 * 60 * 60 * 1000);
    nowDate.setTime(weekDate);

    var weekYear = nowDate.getFullYear();
    var weekMonth = nowDate.getMonth() + 1;
    var weedDay = nowDate.getDate();

    if (weekMonth < 10) { weekMonth = "0" + weekMonth; }
    if (weedDay < 10) { weedDay = "0" + weedDay; }
    var result = weekYear + "-" + weekMonth + "-" + weedDay;

    return result;
}

input 박스에 핸드폰 번호 입력 시 

자동으로 숫자길이를 체크하여 하이픈('-')을 자동 입력 해주는 함수 입니다.

//input에서 입력할때 마다 이 함수의 value를 넣어서 return 시켜주면 됩니다.
function _fnMakePhoneForm(value) {

    var vTel = "";
    var vValue = value;
    vValue = vValue.replace(/-/gi, "");

    //자동 하이픈
    if (vValue.length < 4) {
        vTel = vValue;
    }
    else if (vValue.length < 7) {
        vTel += vValue.substr(0, 3);
        vTel += "-";
        vTel += vValue.substr(3);
    }
    else if (vValue.length < 11) {
        vTel += vValue.substr(0, 3);
        vTel += "-";
        vTel += vValue.substr(3, 3);
        vTel += "-";
        vTel += vValue.substr(6);
    } else {
        vTel += vValue.substr(0, 3);
        vTel += "-";
        vTel += vValue.substr(3, 4);
        vTel += "-";
        vTel += vValue.substr(7);
    }

    return vTel;
}