js 파일 사용시 한글 깨짐

js파일을 jsp 문서에 연결해서 사용하는 경우 한글이 깨져서 표시될 수 있다.
젠장...

예쁘게도 나오는구만



해결방법
-> js 파일의 Encoding을 유니코드로 저장하는거다!


그럼된다!

오예~!

selectbox ...

어려운 녀석이다.


<select id="step" name="step" size="6"  style="width: 100%"></select>

이런식으로 주로 사용하지...
여기서
size는 높이 같음

$J.each(result, function(i,result){
    var val = result.range_a + ' ~ ' + result.range_b + '(' + result.color + ')' ;
    $J('#step').append($J("<option/>", { value: i, text: val}));
    });

ajax 로 불러온 값을 넣으려면 append를 쓰면 된다.


그리고 특정 index 의 값을 바꾸려면,
$J('#step').replaceWith($J("<option/>", { value: selectedData, text: text1}));

해서 replaceWith를 사용하면 된다.



그리고 item의 갯수를 알아오는 것은,

var size = $J("#selectColumnDataList option").size() ;

size를 사용하면 되고,


값을 전체 다 넘기려면

$J('#selectColumnDataList').attr('multiple','multiple');

이렇게 해 준 뒤 ,
for(var i=0; i < size ;i++){
var str = '#selectColumnDataList option:eq(' + i + ')';
$J(str).attr('selected', 'true') ;
}

for 문을 써서 selected를 true로 바꿔주면 된다.

var val = $J("#selectColumnDataList  option:selected").val();
var name = $J("#selectColumnDataList  option:selected").text();
var index = $J("#selectColumnDataList option").index($J("#selectColumnDataList option:selected"));



* optgroup 라는 태그가 있다.
이 녀석은 선택 옵션을 묶을 때 사용하는 태그다.


<select>
<optgroup label="A">
<option>a</option>
<option>b</option>
<option>c</option>
</optgourp>
<optgroup label="B">
<option>d</option>
<option>e</option>
</optgourp>
</select>

Boxer-master/jquery.fs.boxer.js

boxer 라는 팝업 플러그인을 사용했다.


<script src="${pageContext.request.contextPath}/resources/js/Boxer-master/jquery.fs.boxer.js"></script>

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/js/Boxer-master/jquery.fs.boxer.css" />


js와 css를 추가 시켜 준 뒤,

$J(document).ready(function(){
  $J(".boxer").boxer();
 
  $J('.boxer1').click(function(){
   $J('.boxer').attr('href', 'resources/test.jsp'); // << 이 부분은 다른 jsp 페이지를 삽입한 부분!
   $J('.boxer').trigger("click");
  });
 });
이렇게 ready를 준비해 주고,
body에


<a href="#" class="boxer1">Example</a>
<a href="#" class="boxer" data-boxer-height="500"></a>

이렇게 해 주면, .boxer 에 팝업이 뜬다. (mask 처리 된)
우왕-

WEB-INF 밑에는 따로 jsp 이름만으로 접근하기 어려워서 resource 폴더 밑에 두었고,
이 뒤로는 WEB-INF 밑에 넣어 사용함.
* 개발 환경은 Spring + ibatis + postgresql



어차피 화면 이동은 MVC 니까 다 똑같고,
나는 저기서 x 버튼이 아니라 팝업 속 jsp 페이지에서 버튼을 눌렀을 때 팝업이 꺼지게 하고 싶었음.
그래서,

$J(top.document).find(".boxer-close").trigger('click');


이렇게 접근했다.
알고보니 jsp 페이지를 넣는게 iframe 인 듯 해서 iframe 에서 부모 엘리먼트에 접근하는 방식을 사용하였음.

iframe으로 삽입한 화면에서 부모에 접근하기

  1. 부모 페이지의 selector 접근 하기
  $J('#부모페이지원하는노드id', parent.document).trigger('click');
  $J('#부모페이지원하는노드id', parent.document).css('머를', '머로바꿔라');


...

2. 부모 페이지의 다른 iframe에 접근 하기
$J('#부모페이지내다른iframe원하는노드id', parent.frames["iframeid"].document).css('머를', '머로바꿔라');

[js] 배열

헷갈리네

var arr = new Array(길이);

또는

var arr = [1,2,3 ....] ;

두번째 거로 하는게 좋다고 하지만 난 왠지 첫번째게 좋다.

*-_-*

[js] location.href vs location.replace

페이지 이동시에 많이 사용한다.

location.href 
이 녀석은 새로운 페이지로 이동하는데 주소가 히스토리에 기록된다. 이건 뒤로 가기 버튼을 눌렀을 때 , 이전 페이지로 이동이 가능하다는 듯이다.
location.href  = 'a.jsp' ;


location.replace
이놈은 기존 페이지를 새로운 페이지로 변경 시킨다. 주소가 기록되지 않는데, 이 말은 현재 페이지를 새로운 페이지로 덮어 씌운다는것으로 이전 페이지로의 이동이 불가능 하다.
location.replace('a.jsp');

[html] json으로 받아온 값 select 박스에 add 하기

일단, 자바 쪽 코드

String selectedData = request.getParameter("selectedData");

HashMap<String, Object> map = new HashMap<String, Object>();
map.put("selectedData", selectedData);

List<ChildDataVO> childList = new ArrayList<ChildDataVO>() ;
childList = homeSrv.getChildDataList(map);

HashMap<String, Object> mapData = new HashMap<String, Object>();

mapData.put("childList", childList);

JSONObject jso = new JSONObject();
jso.put("result", mapData);

try {
response.setContentType("application/json");
response.setCharacterEncoding("UTF-8"); // 이 부분은 jsp 에서 한글이 깨져서 넣어주었다.
PrintWriter out = response.getWriter();
out.println(jso);
out.close();
} catch (IOException e) {
e.printStackTrace();
}


List로 DB 에서 받아온 값들을 HashMap<String, Object> 에 넣는다.
그리고 이걸 json Object에 넣어!
그러면 이 값이 화면 단으로 넘어가겠지 ?



이제, 화면단 소스(js)
$J.ajax({
    type: "post",
    url: url,
    data : 'selectedData='+param
    ,contentType: "application/x-www-form-urlencoded; charset=UTF-8"
    ,success : function(data){
    console.log('sucess');
    $J("#childDataList").find('option').remove();
   
    var result  = new Array();
    result = data.result.childList ;
    console.log(result[0].dataId);
    $J.each(result, function(i,result){
    $J('#childDataList').append($J("<option/>", { value: result.dataId, text: result.dataName }));
    });
    }
   }).done(function(data){
   
   });

보면 list로 넘어온 object를 스크립트에서 array를 선언해 넣는다.
그 뒤. .each() 함수를 이용했는데, 아직 잘 이해는 안간다.
저기서 value 값엔 data의 id를 text엔 name을 넣은 것이다.


헷갈려....=ㅂ=

dynamic layer popup_02

또 다른 방법을 찾아보았다.

.load() 함수를 쓰는 것!


$(selector).load( url, data, function ) ;


 요렇게 쓰는 녀석이다.



내가 쓴 코드

<script>
$J(document).ready(function(){
var url1 = context + '/popup01';

$J('#my-button').bind('click', function(e) {

$J.ajax({
    type: "post",
    url: url1
   }).done(function(data){
    $J('#element_to_pop_up').bPopup({
           content:'iframe', //'ajax', 'iframe' or 'image'
           contentContainer:'.content',
           loadUrl: context + data.result.url//Uses jQuery.load()
       
      });
});
});


});

</script>
<style>
#element_to_pop_up { display:none;
  left:30%;
  top:20%;
  width:660px;
  height:550px;
 }
 #rightarea{
 float:right;
 }
</style>

<button id="my-button" >POP IT UP</button>
<div id="element_to_pop_up">
<div class="content" id="content"></div>
</div>



<div id="rightarea"><input type="button"  value=">>>>" id="rightBtn"/></div>
<input type="button" id="driver" value="Load Data" />




-> ajax로 controller 쪽으로 요청을 보낸 뒤 해당 url을 반환 한다.

일단 처음에

bPopup으로 팝업을 띄운 뒤,


<html>
<style>
.form-container {
   border: 1px solid #f2e3d2;
   background: #c9b7a2;
   background: -webkit-gradient(linear, left top, left bottom, from(#f2e3d2), to(#c9b7a2));
   background: -webkit-linear-gradient(top, #f2e3d2, #c9b7a2);
   background: -moz-linear-gradient(top, #f2e3d2, #c9b7a2);
   background: -ms-linear-gradient(top, #f2e3d2, #c9b7a2);
   background: -o-linear-gradient(top, #f2e3d2, #c9b7a2);
   background-image: -ms-linear-gradient(top, #f2e3d2 0%, #c9b7a2 100%);

   -webkit-box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
   -moz-box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
   box-shadow: rgba(000,000,000,0.9) 0 1px 2px, inset rgba(255,255,255,0.4) 0 0px 0;
   font-family: 'Helvetica Neue',Helvetica,sans-serif;
   text-decoration: none;
   vertical-align: middle;
   min-width:600px;
   padding:0px;
   margin:0px;
   width:600px;
   height:450px;
   }
.form-field {
   border: 1px solid #c9b7a2;
   background: #e4d5c3;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color: #c9b7a2;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 0px 0px;
   padding:8px;
   margin-bottom:20px;
   width:280px;
   }
.form-field:focus {
   background: #fff;
   color: #725129;
   }
.form-container h2 {
   text-shadow: #fdf2e4 0 1px 0;
   font-size:18px;
   margin: 0 0 10px 0;
   font-weight:bold;
   text-align:center;
    }
.form-title {
   margin-bottom:10px;
   color: #725129;
   text-shadow: #fdf2e4 0 1px 0;
   }
.submit-container {
   margin:8px 0;
   text-align:right;
   }
.submit-button {
   border: 1px solid #447314;
   background: #6aa436;
   background: -webkit-gradient(linear, left top, left bottom, from(#8dc059), to(#6aa436));
   background: -webkit-linear-gradient(top, #8dc059, #6aa436);
   background: -moz-linear-gradient(top, #8dc059, #6aa436);
   background: -ms-linear-gradient(top, #8dc059, #6aa436);
   background: -o-linear-gradient(top, #8dc059, #6aa436);
   background-image: -ms-linear-gradient(top, #8dc059 0%, #6aa436 100%);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   text-shadow: #addc7e 0 1px 0;
   color: #31540c;
   font-family: helvetica, serif;
   padding: 8.5px 18px;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
   }
.submit-button:hover {
   border: 1px solid #447314;
   text-shadow: #31540c 0 1px 0;
   background: #6aa436;
   background: -webkit-gradient(linear, left top, left bottom, from(#8dc059), to(#6aa436));
   background: -webkit-linear-gradient(top, #8dc059, #6aa436);
   background: -moz-linear-gradient(top, #8dc059, #6aa436);
   background: -ms-linear-gradient(top, #8dc059, #6aa436);
   background: -o-linear-gradient(top, #8dc059, #6aa436);
   background-image: -ms-linear-gradient(top, #8dc059 0%, #6aa436 100%);
   color: #fff;
   }
.submit-button:active {
   text-shadow: #31540c 0 1px 0;
   border: 1px solid #447314;
   background: #8dc059;
   background: -webkit-gradient(linear, left top, left bottom, from(#6aa436), to(#6aa436));
   background: -webkit-linear-gradient(top, #6aa436, #8dc059);
   background: -moz-linear-gradient(top, #6aa436, #8dc059);
   background: -ms-linear-gradient(top, #6aa436, #8dc059);
   background: -o-linear-gradient(top, #6aa436, #8dc059);
   background-image: -ms-linear-gradient(top, #6aa436 0%, #8dc059 100%);
   color: #fff;
   }
</style>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/resources/css/form/form.css"/>
<script src="${pageContext.request.contextPath}/resources/js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
var $J = jQuery.noConflict();
var context = '${pageContext.request.contextPath}';
</script>
<script src="${pageContext.request.contextPath}/resources/js/bPopup/jquery.bpopup.js"></script>
<script src="${pageContext.request.contextPath}/resources/js/mask/mask.js"></script>
<script>

 $J(function() {

    // Binding a click event
    // From jQuery v.1.7.0 use .on() instead of .bind()
     $J('.submit-button').bind('click', function(e) {

    // Prevents the default action to be triggered.
        e.preventDefault();
   
        maskMng.clearDiv();
     

    });

});



</script>
<body>
<div id="mom">
<form class="form-container" id="form-container">
<input type="hidden" name="val1" id="val1" value="123" />
<div class="form-title">
<h2>Setting</h2>
</div>
<div class="form-title">Name1</div>
<input class="form-field" type="text" name="firstname" /><br />
<div class="form-title">Email</div>
<input class="form-field" type="text" name="email" /><br />
<div class="form-title">manggo</div>
<input class="form-field" type="text" name="firstname" /><br />
<div class="form-title">medicine</div>
<input class="form-field" type="text" name="email" /><br />
<div class="submit-container">
<input class="submit-button" type="submit" value="Submit" />
</div>
</form>
</div>
</body>
</html>




-> 띄운 화면에서 버튼을 누르면 또다시 ajax 로 다음 화면 주소를 요청하고 결과로 받은 url 을


$J('#mom').load(context+data.result.url);


이렇게 load 해주면 된다.


하하하

[jquery+ajax] dynamic layer popup (?)

layer popup을 동적으로 생성하는 방법 정리.
기존 소스들을 열심히 살펴보았지만 모르겠다. -_-

그래서 생각한 것

1. ajax로 서버에 값을 호출한다.
2. 서버에서 해당 호출에 대한 jsp 페이지 코드를 생성한 뒤 jsonObject 로 던진다
3. 스크립트에서 jquery를 이용하여 동적으로 화면을 생성한다.


...

머리가 나빠서 이렇게 밖에 생각을 못하겠다.
하루를 다 써버렸다;;;

뭔가, 더 쌈박한 방법이 있을텐데...ㅠㅠㅠㅠㅠ

source

home.jsp
<style>
img{float:left; margin:17px}
p{float:left;width:300px}
#mask {
position: absolute;
  left:0;
  top:0;
  width: 100%,
  height: 100%,
  z-index:10000;
  background-color:#000;
  display:none;
}
#show {
  position: absolute;
  left:30%;
  top:20%;
  width:300px;
  height:300px;
  display: none;
}
</style>

<p>
<a href="#" onclick="javascript:maskMng.createMast();">click black mask create!!!!</a>
</p>
<div id="show">
<p>test modal popup</p>
Good morning
<input type="button" value="Next"/>
</div>


<div id="mask">
</div>




mask.js
createMast : function(){
var maskHeight = $J(document).height();
       var maskWidth = $J(window).width();

       $J('#mask').css({'width':maskWidth,'height':maskHeight});

       $J('#mask').fadeIn(100);    
       $J('#mask').fadeTo("fast",0.6);  
     
     
      var url1 = context + '/popup01';
       alert(url1);
     
       $J.ajax({
        type: "post",
        url: url1,
        data: "data:1"
       }).done(function(data){
        console.log(data);
        console.log('----------');
        maskMng.repaint(data);
       });
     

},

repaint : function(data){
alert('repaint:'+ data.result.src);
var clearDiv = document.getElementById("show");
var parentNode = clearDiv.parentNode;
parentNode.removeChild(clearDiv);
console.log('clean div');
var newdiv = document.createElement('div');
newdiv.id = "show";
parentNode.appendChild(newdiv);
console.log('create div');
$J('#show').html(data.result.src);

console.log('insert html');

$J('#show').show();
}


homeContoller.java

@RequestMapping(value = "/popup01")
public void popup01(Locale locale, Model model,HttpServletResponse response) {
logger.error("popup01", locale);

HashMap <String, Object> mm = new HashMap<String, Object>() ;

String src = "" ;
src = "<form class=\"form-container\">" +
"<div class=\"form-title\">" +
"<h2>Sign up</h2>" +
"</div>" +
"<div class=\"form-title\">Name</div>"+
"<input class=\"form-field\" type=\"text\" name=\"firstname\" /><br />" +
"<div class=\"form-title\">Email</div>" +
"<input class=\"form-field\" type=\"text\" name=\"email\" /><br />" +
"<div class=\"submit-container\">" +
"<input class=\"submit-button\" type=\"submit\" value=\"Submit\" />" +
"</div>" +
"</form>";

mm.put("url", "popup/popup01.notiles") ;
mm.put("src",src);
JSONObject jso = new JSONObject();  
jso.put("result", mm) ;


try {
       response.setContentType("application/json");
       PrintWriter out = response.getWriter();
       out.println(jso);
       out.close();
   } catch (IOException e) {
       e.printStackTrace();
   }


}





[결과]

[js] window.opne 에 url 들어갈 때

var url="/tqtkorea/pop.jsp?fullPath=<%=popvo.get(i).getFileupname()%>&fileName=<%=popvo.get(i).getFilename()%>&popName=<%=popvo.get(i).getBbs_id()%>&link="+escape("<%=popvo.get(i).getLink()%>");

[js] substring 과 substr의 차이

substring  이 녀석은 자바스크립트에서 문자열을 끊을 때 시작점과 끝점을 설정해 그 안에 포함된 문자열을 가져온다.

예)
var str = "abcdefg" ;
str.substring (0 , 3) ;


이면 abcd 까지 가져온다.


substr은 시작점에서 부터 몇 개의 문자열을 가져올 때 사용한다.

예)
abcdefg 를 substr(0,3) 하면 0번 인덱스인 a 에서 3개의 문자를 가져오므로 abc가 된다




var str = "abcedfghi" ;
var str1 = str.substring(0,3) ;   ==> abcd
var str2 = str.substr(0,3) ;       ==> abc

[js] 배열....

이렇게도 쓸 수 있구만

var lost = [4, 8, 15, 16, 23, 42];
var count = lost.length;
var i ;
var isLost = function (n) {
  for (i = 0 ; i < count ; i++  ) {
    if ( n === lost[i]) {
      return true;
    }
  }
  return false;
};

[js] window.onload = function()

페이지 로딩시 시작할 스크립트 선언에 대해 <body onload="">의 onload를 많이
  사용해 보았을 것입니다.
  그리고 모든 페이지에서 공통으로 들어갈 스크립트는 페이지 마다 작성을 하지 않고,
  js 파일을 만들어 연결을 하여 사용을 할 것입니다.
  여기서 그럼 모든 페이지에서 load시 공통으로 실행될 스크립트는 어떻게 작업을 할까요??

  window.onload를 사용 하면 됩니다.

    window.onload = function(){ 시작시 실행될 내용 }
  이런식으로

  그런데 문제는 window.onload와 <body onload="">는 동시에 사용을 할 수 없돠
  <body onload="">가 실행이 되면 window.onload는 실행이 되지 않는 문제가 있지....

  그래서 이를 해결하고자 할때 사용하는 것이
  window::onload()

    function window::onload(){ 시작시 실행될 내용 } >> 될 수 있음 쓰지마...ie 에서만 ...

  실행 순서는 <body onload="">가 먼저 실행되고, 이어서 window::onload()가 실행




window.onload
전체 페이지의 모든 외부 리소스와 이미지가 브라우저에서 불러진 이 후 작동.
디딜레이가 생기면 그만큼 오래 걸림

$J('document').ready(function(){ }
외부 리소스, 이미지 상관없이 dom만 로드가 완료되면 바로 실행
더 빠름

[js] 접속 브라우저 알아보기

function a (){
 alert(navigator.appName) ;
}

[js] 새로고침, 뒤로가기 막기

document.onkeydown = function(e){
 key = (e) ? e.keyCode : event.keyCode ;
 if(key == 8 || key == 116){
  if(e){
   e.preventDefault();
  }else{
   event.keyCode = 0 ;
   event.returnValue = false ;
  }
 }
}

[js] 팝업 window.open

window.open("팝업페이지명","팝업이름","옵션")

옵션

scrollbars = yes 스크롤바 사용 (미사용 no)
resizeable = yes 좌우스크롤바 사용 (미사용 no)
menubar = yes    메뉴바 사용 (미사용 no)
toolbar = yes    툴바사용 (미사용 no)
width = 100      팝업창의 가로사이즈
height = 100     팝업창의 세로사이즈
left = 10        좌측에서 10픽셀을 띄운다.
top = 10         상단에서 10픽셀을 띄운다.

[js] 브라우저 정보 취득 - navigator

<script language='javascript'>
if ( (navigator.userAgent.match(/iPhone/i))||    //아이폰
   (navigaor.userAgent.match(/iPod/i))||          //아이팟
   (navigator.userAgent.match(/android/i)))       //안드로이드 계열

{
window.location.href='모바일 사이트 주소';
} else {
window.location.href='일반 웹사이트 주소';
}
</script>

[js] date : 날짜

var d = new Date();

'현재 년: ' = d.getFullYear();
'현재 월: ' = (d.getMonth() + 1) ;
'현재 일: ' = d.getDate();


'현재 시: ' = d.getHours() ;
'현재 분: ' = d.getMinutes();
'현재 초: ' = d.getSeconds();



'오늘 요일: ' = d.getDay(); // 일요일 = 0

[js] document.get

var agree[] = getElementsByName("agree") ; // 여러개 쓸 때
<input type="checkbox" class="vm" id="agree" name="agree">
<input type="checkbox" class="vm" id="agree" name="agree">


$J('document').ready(function(){

});

[js] validation

function js_validateForm_fw(formObj) {
 this.form = formObj;            // 대상폼 폼
 checkAll(formObj) ;  
}

// 전체 폼 체크
function checkAll(formObj) {

    return this.checkAllInput(formObj) && this.checkAllSelect(formObj) && this.checkAllTextarea(formObj);
}

function checkAllInput(formObj) {
 this.form = formObj;
    for (var i=0; i< this.form.elements.length; i++) {
        if (this.form.elements[i].tagName == "INPUT") {
         if (this.form.elements[i].type != "hidden"){
          if ( !this.checkObject(this.form.elements[i])) return false;
         }
        }        
    }
    return true;
}
function checkAllSelect () {
    for (var i=0; i< this.form.elements.length; i++) {
        if (this.form.elements[i].tagName == "SELECT") {
            if ( !this.checkObject(this.form.elements[i])) return false;
        }
    }
    return true;
}

function checkAllTextarea() {
    for (var i=0; i< this.form.elements.length; i++) {
        if (this.form.elements[i].tagName == "TEXTAREA") {
            if ( !this.checkObject(this.form.elements[i])) return false;
        }
    }
    return true;
}
// 하나의 입력항목에 대한 체크
function checkObject (eleObj) {
    // var lio = eleObj.name.lastIndexOf(":");
    // id를 있다면 ID 기반으로 없다면 name 기반으로 옵션 체크를 한다.
    var splitName = (isNullObject(eleObj.id) ? eleObj.name.split(":") : eleObj.id.split(":") );
    var objValue  = eleObj.value;
    this.message = new Dictionary();
    this.message.put(   "m"       , "을 입력해주십시오.");
    this.message.put(   "/"       , "입력값이 지정된 형식과 일치 하지 않습니다.");
    this.message.put(   "f"       , "입력값이 실수형이 아닙니다.");
    this.message.put(   "i"       , "은 숫자를입력해 주십시오.");
    this.message.put(   "l"       , "입력값이 Long형이 아닙니다.");
    this.message.put(   "H"       , "입력값은 한글을 포함할 수 없습니다.");
    this.message.put(   "h"       , "입력값은 한글이 포함되어 있지 않습니다.");
    this.message.put(   "e"       , "Email 형식이 올바르지 않습니다.");
    this.message.put(   "y"       , "년도 형식이 올바르지 않습니다.");
    this.message.put(   "d"       , "날짜형식이 올바르지 않습니다.");
    if (splitName.length > 1) {
        // 해당 Object의 validation값 체크
        var objValidationFlag = true;

        for ( var j = 1; j < splitName.length ; j++) {
            switch (splitName[j].charAt(0) ) {
                // 필수 입력 처리
                case "m":
                    objValidationFlag = isMandatory(objValue);
                    break;

                // Regular 항목 체크
                case "/":
                    objValidationFlag = isEmpty(objValue) ? true : isSearch(objValue, splitName[j]);
                    break;

                // Float 체크
                case "f":
                    objValidationFlag = isEmpty(objValue) ? true : isFloat(objValue);
                    break;

                // Int 체크
                case "i":
                    objValidationFlag = isEmpty(objValue) ? true : isInt(objValue);
                    break;

                // Long 체크
                case "l":
                    objValidationFlag = isEmpty(objValue) ? true : isLong(objValue);
                    break;

                // 한글이 포함되어 있는가 검사
                case "h":
                    objValidationFlag = isEmpty(objValue) ? true : isHangul(objValue);
                    break;

                // 한글이 포함되어 있지 않은가 체크
                case "H":
                    objValidationFlag = isEmpty(objValue) ? true : !isHangul(objValue);
                    break;

                // Email 체크
                case "e":
                    objValidationFlag = isEmpty(objValue) ? true : isEmail(objValue);
                    break;

                // 년도체크
                case "y":
                    objValidationFlag = isEmpty(objValue) ? true : isYear(objValue);
                    break;
                   
                // 날짜체크
                case "d":
                    objValidationFlag = isEmpty(objValue) ? true : isDate(objValue);
                    break;                      
            }
           
            if(!objValidationFlag) {
                var msg = "[" + (isNullObject(eleObj.alt) ? splitName[0] : eleObj.alt) + "]";
                msg += "\n" + this.message.get(splitName[j].charAt(0));
                alert(msg);
                try{eleObj.focus();} catch (e) {}
                return false;  
            }
        }

        // 존재하는가 체크
        var intendedObj = document.getElementsByName(splitName[0])[0];
        if (isNullObject(intendedObj)) {
            // input 타입의 새로운 객체 생성
            var newObj = document.createElement("input");
            newObj.type  = "hidden";
            newObj.name  = splitName[0];
            newObj.id    = splitName[0];
            newObj.value = objValue

            this.form.appendChild(newObj);
        } else {
            // TODO: 동일 이름의 객체가 두개 이상일 수 있다.
            // - 지금은 하나만 만든다.
            intendedObj.value = objValue
        }
       
    }

    return true;
}
function check_m(el) {
    return isMandatory(el) ;
}

function isMandatory(el) {
    return (el == "" || el == null) ? false : true;
}

function isSearch(el, pattern) {
    eval("var fm = " + pattern + ";");
    var p = el.search(fm);
    return (p == -1 ? false : true);  
}

function isFloat(el) {
    if (isNaN(parseFloat(el))) {
        return false;
    }
    return true;
}

function isInt(el) {
    if (isNaN(parseInt(el)) ||
        (parseInt(el) != parseFloat(el))) {
        return false;
    }
    return true;
}

function isLong( el) {
    return isInt(el);
}

function isNullObject(el){
    return (el == "undefined" || el==null) ? true : false;
}

function isEmpty(el){
    return ( el == null  || el == "" ) ? true : false;
}

function isEmail(el) {
    var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i

    return (el.search(filter) == -1 ? false : true);
}

// 한글 체크하는것이 아니라 유니코드체크하는것이네.. 쩝.. ^^;;
// 머 크게 문제는 없겠지...
function isHangul(el) {
    return (escape(el).search(/%u/i) == -1 ? false : true );
}

function trim(str){
     return str.replace(/(^\s*)|(\s*$)/ig, "");
 }

function isYear(str) {
    return isSearch(str, "/^\d{0,4}$/i");      // <- /^\d{4}$/i
}

function isDate(str) {
    return isSearch(str, "/^(\d{1,4})\\/((0[1-9])|(1[0-2]))\\/((0[1-9])|([1-2][0-9])|(3[0-1]))$/i");
}



function Dictionary () {
    this.nodeObject = new Object();
    this.count=0;


    this.put = function (key, value) {
        obj = this.nodeObject;
        this.searchFlag = 0;

        var addFlag = true;
        for(var n in obj) {
            if(n == key) {
                obj[key] = value;
                addFlag = false;
            }
        }

        if(addFlag) {
            obj[key] = value;
            this.count++;
        }
    }

    this.get = function(key) {
        obj = this.nodeObject;

        return obj[key];
    }

    this.keys = function(){
        return this.nodeObject;
    }

    this.del = function(key){
        this.put(key, null);
        this.count--;
    }
   
    this.size = function(){
        return this.count;
    }
}