달력

9

« 2019/9 »

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  •  
  •  
  •  
  •  
  •  
2017.11.22 09:33

Input Text의 유효성 검사 Language/JavaScript2017.11.22 09:33

공통.js에 아래 부분을 넣는다. 


<script>

var essentialCheckArr = [];

//저장 전에 호출

//필수 항목에 값이 다 있을 경우에만 true 반환

function checkEssential(){

for(var i=0;i<essentialCheckArr.length;i++){

var tmpStr = $('#'+ essentialCheckArr[i]).val();

if( tmpStr == '' || tmpStr == null ){

alert("필수 입력사항입니다.");

$('#'+ essentialCheckArr[i]).focus();

return false;

}

}

return true;

}

/* 

* 유효성 검사 기능

* inputObj 검사를 할 대상 Object

* validFuncArray 검사 항목 지정(배열 형태) : ex) ["isNumer","spaceCheck"]

* maxLength 최대 길이 체크 ( 0 일 경우 제외 )

* essential 필수여부 'Y'/'N' 값이 Y인 경우 checkEssential function을 호출할 경우 해당 항목에 값이 있는지 체크하여 결과값을 반환한다.

*/

function textValidation(inputObj, validFuncArray, maxLength, essential){

if( essential == 'Y'){

essentialCheckArr.push( inputObj.attr("id") );

}

inputObj.bind('focusin keyup', function(){ // input태그에 포커스가 들어오거나 키가 눌렸을 때 실행됨

var inputValue = inputObj.val();

if( maxLength > 0 ){

if( inputValue.length > maxLength) {

alert("<spring:message code='cmn.vaild.maxLen' />");

inputObj.val( inputValue.substring(0, maxLength ) );

inputObj.focus();

return;

}

}

var funcResult = null; // 함수 실행 결과를 담을 flag

for(i=0; i<validFuncArray.length; i++){ // 검증에 사용할 함수명 배열을 반복문으로 돌린다.

var funcName = validFuncArray[i]; // 배열에서 함수명을 하나씩 뽑아낸다. 

var funcObj = window[funcName]; // 함수명(string)을 객체(object)로 받는다.

funcResult = funcObj(inputValue); //  해당 함수를 실행하여 결과 메시지를 변수에 담는다. 만약 함수 전체를 통과하면 Null을 반환한다.

if(funcResult != null){ // 검증에 통과하지 못한 함수가 있을 경우 반복문 탈출

break;

}

}

if(funcResult != null){ // 검증에 통과하지 못했을 때,

alert(funcResult); 

inputObj.val( inputValue.substring(0, inputValue.length -1 ) );

inputObj.focus();

}else{ // 검증에 통과했을 때,

});

}

/**

* 입력값이 특정 문자만으로 되어있는지 체크하며

* 특정문자만을 허용하려 할때 사용한다.

*/

function containsCharsOnly(input, chars){

for (var i=0; i < input.length; i++){

if (chars.indexOf(input.charAt(i)) == -1){

return false;

}

}

return true;

}

 

// 영문과 숫자만 입력받도록 검증

function isAlphabetNumber(str){

var check = /^[A-Za-z0-9]*$/;

if(check.test(str)){

return "영문과 숫자 입력이 가능합니다.";

}

return null;

}

// 영문만 입력받도록 검증

function isAlphabet(str){

var check = /[^A-Za-z\s]/;

if(check.test(str)){

return "영문만 입력이 가능합니다.";

}

return null;

}


// 공백 허용하지 않도록 검증

function spaceCheck(inputVal){

var invalid = " ";

if(inputVal.indexOf(invalid) > -1){

return "공백이 허용되지 않습니다.";

}else{

return null;

}

}

/**

* 입력값이 알파벳 대문자인지 체크한다

*/

function isUpperCase(input){

var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

if( containsCharsOnly(input, chars) ) return null;

else return  "대문자만 입력가능합니다.";

}

/**

* 입력값이 알파벳 소문자인지 체크한다

*/

function isLowerCase(input){

var chars = "abcdefghijklmnopqrstuvwxyz";

if( containsCharsOnly(input, chars) ) return null;

else return  "소문자만 입력가능합니다.";

}

/**

* 입력값이 숫자만 있는지 체크한다.

*/

function isNumer(input){

var chars = "0123456789.";

if( containsCharsOnly(input, chars) ) return null;

else return  "숫자만 입력가능합니다.";

}

/**

* 입력값이 이메일 형식인지 체크한다

*/

function isValidEmail(input){

       var format = /^((\w|[\-\.])+)@((\w|[\-\.])+)\.([A-Za-z]+)$/;

       if(format.test(input)) return "이메일 형식으로 작성하여야 합니다.";

       else return null ;

}


/**

* 입력값이 전화번호 형식(숫자-숫자-숫자)인지 체크한다

*/

function isValidPhone(input){

       var format = /^(\d+)-(\d+)-(\d+)$/;

       if(format.test(input)) return "전화번호 형식으로 작성하여야 합니다.";

       else return null ;

}

</script>




--------------------------------------------------------------------------------------------------------------

사용법

//input text를 event에 등록
$(document).ready(function() {
    ...
    textValidation( $("#ID"), ["isNumer","spaceCheck"], 10, 'Y' );
}


//저장 전 checkEssential()를 호출하여 필수체크로 정의된 input 중 값이 없는게 있는지 체크한다.

$('#saveBtn').click(function(){

if( checkEssential() ){

Save();                                

}

});



Posted by 현자

댓글을 달아 주세요

  1. 코락 CoRock 2019.03.08 10:13 신고  댓글주소  수정/삭제  댓글쓰기

    Validation 할 때 도움이 되었습니다
    좋은 글 감사합니다~

//선언
 function getSelectRadioBtn(radioVal){
  for(var i=0;i<radioVal.length;i++){
   if(radioVal[i].checked)
    return radioVal[i].value;
  }
  return -1;
 }

//호출
getSelectRadioBtn( document.getElementsByName('isuseroad') );
Posted by 현자

댓글을 달아 주세요

    public static boolean isMultipartForm(HttpServletRequest request) {
        String v_contentType = StringManager.chkNull(request.getContentType()); //chkNull은 널값일 경우 ""로 치환
        return v_contentType.indexOf("multipart/form-data") >= 0;              
}
Posted by 현자

댓글을 달아 주세요

현재 창에서 열린 팝업을 종료해야 될 경우가 있다.

아래 소스는 10초 후에 팝업창이 닫힌다.

==========================================================================================

 var popupObj;                                                    //팝업 창 생성 여부 확인, 전역 변수로 설정
 
 var stopTimeCheck = "";                                     //해당 팝업을 다시 열었을 경우 타이머 초기화
 
 function popupOpen(url){                                  //이 메서드를 통해 팝업을 오픈 시킨다.
  popupObj = window.open(url);

  if(stopTimeCheck != "")                                        //팝업을 다시 열 경우 기존 타이머를 초기화한다. 단 
   clearTimeout(stopTimeCheck);                           //처음 팝업을 열 경우에는 예외처리한다.

  stopTimeCheck = setTimeout( closePopup, 10000);   //10초 후에 closePopup 메서드를 실행시킨다.
 }
 
 function closePopup(){
  if(popupObj != undefined){
   popupObj.close();                                                 //팝업 종료
   popupObj = undefined;                                           
  }
 }


PS) 모바일 웹 페이지에서 동영상 URL을 팝업으로 열면 IOS에서는 내장 플레이어, ANDROID에서는 사용자가
임의로 동영상 플레이어를 설정 할 수 있다. 동영상을 일정 시간만 재생한 뒤 종료 해야 될 경우에도 위에 소스
를 사용하여 영상을 종료 시킬 수 있다.

Posted by 현자

댓글을 달아 주세요

var targetDiv = eval("document.all." + div명);

var text = "";
text += "<TABLE>";
text += "</TABLE>";

targetDiv.innerHTML = text;
Posted by 현자

댓글을 달아 주세요

2011.05.03 15:18

post 방식으로 팝업 열기 Language/JavaScript2011.05.03 15:18

function openPop(target1, target2)
 {
 
  var f = document.map;
  
  var w = screen.availWidth-10;
  var h = screen.availHeight - 30 ;
  var settings = 'height='+h+',width='+w+',top=0,left=0;
  
  window.open( "", "pop", settings);
  
  var url = "http://sound10000w.tistory.com";
  
//인자로 넣어 줄 값 Form 에서 hidden으로 설정
  f.m1.value = target1;
  f.m2.value = target2;
  
  f.target = 'pop';
  f.action = url;
  f.method = 'post';
  
  f.submit();
 }
Posted by 현자

댓글을 달아 주세요

// 지우기 전에 확인하기~
function deleteAction(){
  var delFlag = window.confirm('정말 삭제 하시겠습니까?');
       
        if(delFlag){
           //확인버튼을 눌렀을 경우 수행 할 부분
           ;               
        }else{
           //취소버튼을 눌렀을 경우 수행 할 부분
            ;
        }
 }

'Language > JavaScript' 카테고리의 다른 글

div를 이용한 특정부분만 갱신하기~  (0) 2011.07.06
post 방식으로 팝업 열기  (0) 2011.05.03
확인 창 결과에 따라 분기시키기  (0) 2011.03.30
unicode 한글 변환 코드  (0) 2011.03.18
unicode 한글 변환  (0) 2011.03.18
Post 방식으로 팝업 창 열기  (0) 2010.05.07
Posted by 현자

댓글을 달아 주세요

2011.03.18 17:14

unicode 한글 변환 코드 Language/JavaScript2011.03.18 17:14

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
function trans(){
 var str = document.getElementById("hangul").value;
 
 document.getElementById("unicode").value = replaceAll(escape(str),"%","\\");
}

function detrans(){
 var str = document.getElementById("unicode2").value;
 
 document.getElementById("hangul2").value = unescape(replaceAll(str,"\\","%"));
}
function replaceAll(strTemp, strValue1, strValue2){
 
    while(1){
        if( strTemp.indexOf(strValue1) != -1 )
            strTemp = strTemp.replace(strValue1, strValue2);
        else
            break;
    }
    return strTemp;
}
</script>
한글 -> 유니코드
<input type="text" name="hangul" id="hangul" onkeyDown="JavaScript:if(event.keyCode==13){trans();}">
<input type="button" name="aa" value="변환" onclick="trans()">
결과 :<input type="text" name="unicode" id="unicode" size="50">
<br><br>
유니코드 -> 한글
<input type="text" name="unicode2" id="unicode2" onkeyDown="JavaScript:if(event.keyCode==13){detrans();}">
<input type="button" name="aa" value="변환" onclick="detrans()">
결과 :<input type="text" name="hangul2" id="hangul2" size="50">
</body>
</html>

'Language > JavaScript' 카테고리의 다른 글

post 방식으로 팝업 열기  (0) 2011.05.03
확인 창 결과에 따라 분기시키기  (0) 2011.03.30
unicode 한글 변환 코드  (0) 2011.03.18
unicode 한글 변환  (0) 2011.03.18
Post 방식으로 팝업 창 열기  (0) 2010.05.07
JavaScript로 윈도우 7 확인하기  (0) 2010.05.06
Posted by 현자

댓글을 달아 주세요

2011.03.18 17:11

unicode 한글 변환 Language/JavaScript2011.03.18 17:11

변환기 ~

한글 -> 유니코드

결과 : 

유니코드 -> 한글

결과 : 

'Language > JavaScript' 카테고리의 다른 글

확인 창 결과에 따라 분기시키기  (0) 2011.03.30
unicode 한글 변환 코드  (0) 2011.03.18
unicode 한글 변환  (0) 2011.03.18
Post 방식으로 팝업 창 열기  (0) 2010.05.07
JavaScript로 윈도우 7 확인하기  (0) 2010.05.06
Window 객체  (0) 2010.04.19
Posted by 현자

댓글을 달아 주세요

2010.05.07 10:08

Post 방식으로 팝업 창 열기 Language/JavaScript2010.05.07 10:08

팝업창 열 때 Get 방식으로 열어 버리면 변수가 노출 되므로, 
요런 방법을 이용하자!

 function OpenPopupWithPost(code){
  var f = document.form1;
  f.code.value = code;
  
  var url = http://www.tistory.com;
  
  var w = screen.availWidth-10;
  var h = screen.availHeight - 30 ;
  
  var settings = 'height='+h+',width='+w+',top=0,left=0,status=no,resizable=no,toolbars=no,location=no,scrollbars=yes';
  var popWin=window.open("","uri",settings);
  
  f.target='uri';
  f.action=url;
  
  f.submit();
 }

'Language > JavaScript' 카테고리의 다른 글

unicode 한글 변환 코드  (0) 2011.03.18
unicode 한글 변환  (0) 2011.03.18
Post 방식으로 팝업 창 열기  (0) 2010.05.07
JavaScript로 윈도우 7 확인하기  (0) 2010.05.06
Window 객체  (0) 2010.04.19
인터넷익스플로러 버전 보기  (0) 2010.04.08
Posted by 현자

댓글을 달아 주세요