어떤 사이트들에서는 페이지의 텍스트를 드래그해서 선택한 후 바로 검색을 할 수 있게 만든 기능들이 있다.
그래서 그 기능의 핵심인 선택한 텍스트를 가져오는 스크립트를 만들어 보았다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <style type="text/css">
            #console { width: 300px; height: 20px; border: 1px solid #ccc; }
        </style>
        <script type="text/javascript">
            function selectText() {
                var selectionText = "";
                if (document.getSelection) {
                    selectionText = document.getSelection();
                } else if (document.selection) {
                    selectionText = document.selection.createRange().text;
                }
                return selectionText;
            }
           
            document.onmouseup = function() {
                document.getElementById("console").innerHTML = selectText();
            }
        </script>
    </head>
    
    <body>
        <p>abcdefghijklmnopqrstuvwxyz</p>
        <p>마우스로 드래그해서 선택한 글 나오기</p>
        <div id="console"></div>
    </body>
</html>

출처 : http://junyong.pe.kr/131

IE8에서 이미지 업로드시 기존의 돌아다니는 소스들은 이미지 미리보기 기능이 동작하지 않았다
IE8에서는 file의 경로(obj.value)를 가져오면 실제 클라이언트의 경로대신
보안상의 이유로 'fakepath'라는 경로를 반환한다.

그래서 플래시업로드를 이용하면 가능한 방법들이 많다. (ex. http://code.google.com/p/swfupload/)
그러나 플래시를 이용하지 않고 방법이 없을까 하고 구글링 중에 찾은 포스팅이 있었다.
소스를 보니 IE8에서는 브라우저 클립보드를 이용해서 클라이언트경로를 가져오는 것이다 !
근데 클립보드를 사용하려면 클립보드를 엑세스한다는 창이 뜬다.

그래서 좀 더 괜찮은 방법이 없나 생각해서 좀 바꿔보았다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title></title>
    <style type="text/css">
        .preView { width: 70px; height: 70px; text-align: center; border:1px solid silver; }
    </style>
    <script type="text/javascript">

        function fileUploadPreview(thisObj, preViewer) {
            if(!/(\.gif|\.jpg|\.jpeg|\.png)$/i.test(thisObj.value)) {
                alert("이미지 형식의 파일을 선택하십시오");
                return;
            }

            preViewer = (typeof(preViewer) == "object") ? preViewer : document.getElementById(preViewer);
            var ua = window.navigator.userAgent;

            if (ua.indexOf("MSIE") > -1) {
                var img_path = "";
                if (thisObj.value.indexOf("\\fakepath\\") < 0) {
                    img_path = thisObj.value;
                } else {
                    thisObj.select();
                    var selectionRange = document.selection.createRange();
                    img_path = selectionRange.text.toString();
                    thisObj.blur();
                }
                preViewer.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fi" + "le://" + img_path + "', sizingMethod='scale')";
            } else {
                preViewer.innerHTML = "";
                var W = preViewer.offsetWidth;
                var H = preViewer.offsetHeight;
                var tmpImage = document.createElement("img");
                preViewer.appendChild(tmpImage);

                tmpImage.onerror = function () {
                    return preViewer.innerHTML = "";
                }

                tmpImage.onload = function () {
                    if (this.width > W) {
                        this.height = this.height / (this.width / W);
                        this.width = W;
                    }
                    if (this.height > H) {
                        this.width = this.width / (this.height / H);
                        this.height = H;
                    }
                }
                if (ua.indexOf("Firefox/3") > -1) {
                    var picData = thisObj.files.item(0).getAsDataURL();
                    tmpImage.src = picData;
                } else {
                    tmpImage.src = "file://" + thisObj.value;
                }
            }
        }

    </script>
</head>
<body>
    <input id="fileData" name="fileData" type="file" onchange="fileUploadPreview(this, 'preView')" />
    <div id="preView" class="preView" title="이미지미리보기"></div>
</body>
</html>

SyntaxHighlighter에서 doctype과 html태그를 빼버려서 그냥 box로 ;;

기존 소스에서  클립보드부분을 다르게 바꿨다.(약간은 내 맘대로 수정 : )
문제가 있다면 삭제 하겠습니다.(트랙백 날립니다~)

테스트 한 브라우저는 일단 IE8, IE7, IE6, Firefox 3.5.2 ! 끝 !

출처 : http://junyong.pe.kr/98

JSTL core

 

- JSTL 에서 기본적인 기능들을 구현해 놓은 라이브러리.

- 자바 코드를 사용하지 않아도 쉽게 기본 기능을 구현할 수 있다.

- JSP 페이지에 태그 라이브러리로 등록을 해야한다.

등록하는 방법은

<%@ taglib prefix="c" uri=http://java.sun.com/jsp/jstl/core %>

prefix 의 c 는 태그를 사용할 때 항상 붙는 접두어(ex. <c:out>)

uri 는 core 라이브러리가 존재하는 위치

 

JSTL core 라이브러리에 있는 태그

종류

- 출력태그 : <c:out>

- 변수 설정 및 삭제 태그 : <c:set>,<c:remove>

- 예외 처리 태그 : <c:catch>

- 조건 처리 태그 : <c:if>, <c:choose>, <c:when>, <c:otherwise>

- 반복 처리 태그 : <c:forEach>, <c:forTokens>

- 페이지 처리 태그 : <c:import>, <c:redirect>, <c:url>, <c:param>

 

설명

<c:out>

- 지정된 값을 출력시키는 태그.

 

<c:out value="출력값" default="기본값" escapeXml="true 또는 false">

value 속성을 이용해서 변수의 내용을 출력할 수 있다.

value 값이 null 일 경우 dafault 속성의 값을 기본 값으로 사용하게 된다.

escapeXml 은 기본값으로 false 로 지정되어 있으며 <, > 등의 특수 기호의 출력 형태를 설정할 때 쓴다. True 일 경우 < 는 &lt; 로 표현되고, > 는 $gt; 로 표현된다.

 

<c:set>

- 지정된 변수에 값을 입력하는 태그

 

<c:set var="변수명" value="설정값" target="객체" property="값" scope="범위">

var 는 값을 저장할 변수이고

value 는 저장할 값이다.

target 은 값을 설정할 프로퍼티에 대한 객체,

property 는 값을 설정할 객체의 프로퍼티를 의미

scope 는 변수의 유효범위, 설정하지 않으면 기본값으로 page 를 갖는다.

 

<c:remove>

- 설정된 속성을 제거하는 태그

 

<c:remove var="변수명" scope="범위">

var 은 설정된 속성이 저장되어 있는 변수

scope 는 지정된 범위에세 저장된 속성을 찾는다.

 

<c:catch>

- 예외 처리를 위한 태그

 

<c:catch var="변수명">

예외가 발생하면 var에 지정된 변수에 오류 내용을 입력한다.

 

<c:if>

- 조건 처리를 할때 쓰이는 태그, java의 if와 동일한 기능

 

<c:if test="조건" var="변수명" scope="범위">

test 조건을 지정한다.

var 조건 처리한 결과를 저장한다.

scope는 var 속성에 지정한 변수의 범위를 의미한다.

 

<c:choose>

- 조건 처리를 할 때 쓰이는 태그, java 의 switch 와 동일한 기능

 

<c:choose>

   <c:when test="조건"></c:when>

   <c:otherwise></c:otherwise>

</c:choose>

test 속성으로 조건을 확인하여 만족하면 <c:when>과 </c:when> 사이의 내용을 처리한다.

( <c:when> 태그는 조건에 따라 여러개가 사용될 수 있다.)

모든 조건에 만족하지 않을 경우 <c:otherwise>과 </c:otherwise> 사이의 내용을 처리한다.

 

<c:forEach>

- 자바의 for 문과 동일한 기능

 

<c:forEach items="객체명" begin="시작 인덱스" end="끝 인덱스" step="증감식"

  var="변수명" varStatus="상태변수">

items 속성에 인덱스가 존재하는 객체를 지정하여 객체의 인덱스만큼 반복할 수 있다.

begin과 end 속성으로 원하는 범위만큼 반복문을 수행한다.

step 증감식 설정

var 은 현재 반복하고 있는 값을 기억하는 변수

varStatus 는 반복의 상태를 갖게 되는 변수

 

<c:forTokens>

- 자바의 for 문과 StringTokenizer 객체를 결합하였다고 볼 수 있다.

 

<c:forTokens items="객체명" delims="구분자" begin="시작 인덱스" end="끝 인덱스" step="증감식" var="변수명" varStatus="상태변수">

items에 지정한 값을 delims 속성의 구분자로 나눈 후 나눠진만큼 반복수행.

items, delims, var 이 3가지 속성만으로도 수행가능.

begin, end 는 delims 구분자로 나눠진 값들을 기준으로 시작 값과 끝 값을 정해준다.

 

<c:import>

- 지정된 URL을 태그가 사용된 JSP 페이지에 출력시키는 기능

 

<c:import url="URL값" var="변수명" scope="범위" varReader="변수명"

  context="context명" charEncoding="인코딩값">

url 속성에는 http뿐만 아니라 FTP 외부 리소스도 올 수 있다.

var 은 리소스가 저장될 변수명

scope 는 var 속성의 범위

varReader 는 var 속성과 마찬가지로 리소스가 저장될 Reader 객체 변수

context 는 URL에 접근할 대 컨텍스트 이름

charEncoding 는 URL 의 리소스를 가져올 때 인코딩 방법

 

<c:redirect>

- 지정된 URL 페이지로 이동시키는 기능을 한다.

 

<c:redirect url="URL값" context = "contextName">

url 은 이동할 URL 을 입력한다.

context 는 컨텍스트 이름을 입력하지만,

보통은 url 속성만 입력한다.

 

<c:url>

- url 을 생성하는 기능을 한다.

 

<c:url var="변수명" scope="범위" value="값" context="contextName">

value 속성에 지정된 값으로 URL을 생성한다.

scope 는 var 속성에 입력되어 있는 변수의 범위를 의미

 

<c:param>

- <c:import> 태그에 파라미터를 전달하기 위한 태그

 

<c:param name="파라미터명" value="값">

name 속성에 파라미터 명을 입력하고,

value 에 값을 입력하여 전달


자바스크립트를 이용 

<script>

    function check(){     // 함수 호출
        if(document.frm.one.value == ""){   // 만약, frm 의 one 의 value(값)이 == "" 공백이라면
        alert('값을 입력해주세요') ;              //경고창을 띄워주고
        return false;                                          //return FALSE (false 는 b.jsp 로 넘기지 않겠다는뜻)
        }
    return true ;                        // 그렇지 않고 값이 있다면 TRUE 값을 넘겨준다
    }

</script>

 <form action="b.jsp" name="frm"  Onsubmit="return check()"> // JSP페이지에 값을 넘기기
     <input type="text" name="one">                                                 //전에 check()함수 실행한다
     <input type="submit" value="확인">  // 확인버튼 누르면 Onsubmit 이 실행된다
</form>


징그럽게 내 발목을 잡던 스트럿츠 다운로드 해결... 거즘....2주간 붙잡고 있었던 것 같다.

한글 파일은 다운이 안되던 문제를 겨우 해결...

import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;

public class downloadAction extends Action {
 
 @Override
 public ActionForward execute(
      ActionMapping mapping,
      ActionForm form,
      HttpServletRequest request,
      HttpServletResponse response)
    throws Exception {

  try {

   String filePath = "D:\\workspace\\DKIEX\\WebContent\\upload";
   String fileName = (String) request.getParameter( "fileName" );
   String originFileName = (String) request.getParameter( "originFileName" );
   
   fileName = new String(fileName.getBytes("8859_1"), "euc-kr");
   
   String orgFileName = java.net.URLEncoder.encode(new String(originFileName.getBytes("8859_1"), "euc-kr"),"UTF-8");
      
   if (request.getHeader( "User-Agent" ).indexOf( "MSIE 5.5" ) > -1){
    response.setHeader( "Content-Type", "doesn/matter;" );
    response.setHeader( "Content-Disposition", "attachment; filename=" + orgFileName + ";" );
   }
   else{    
    response.setHeader( "Content-Type", "application/octet-stream;" );
    response.setHeader( "Content-Disposition", "attachment; filename=" + orgFileName + ";" );
   }
   
   File file = new File( filePath +"\\"+new String(originFileName.getBytes("8859_1"),"euc-kr"));
   byte b[]  = new byte[(int) file.length()]; // file.length()
   
   response.setHeader( "Content-Transfer-Encoding", "binary;" );
   response.setHeader( "Content-Length", "" + file.length() );
   response.setHeader( "Pragma", "no-cache;" );
   response.setHeader( "Expires", "-1;" );   
    
   BufferedInputStream fin = new BufferedInputStream( new FileInputStream( file ) );
   BufferedOutputStream outs = new BufferedOutputStream( response.getOutputStream() );
   
   int read = 0;
      
   while ((read = fin.read( b )) != -1){
    outs.write( b, 0, read );
   }    
   outs.flush();
   outs.close();
   fin.close();
   
  }catch (Exception e){
   e.printStackTrace();
   System.out.println("Exception");
  }
  return null; // 리턴정보가 필요 없기 때문임
  // 여기에 리턴정보를 맵핑시키면 화면상에는 에러가 뜨지 않지만 로그상에는 오류로 기록되기때문에
  // null 처리 함
 }
}


1.레이어를 만듭니다.

<Div id="Pop" style="position:absolute; left:100px; top:100px; width:100px; height:100px; z-index:1;"></Div>

   Pop라는 이름의 레이어를 이렇게 생성합니다.

   윈도우창 왼쪽에서 100px 위에서 100px 떨어진 곳에 시작하는 레이어죠.

 

2.레이어속에 원하는 내용물을 넣어줍니다.

<Div id="Pop" style="position:absolute; left:100px; top:100px; width:100px; height:100px; z-index:1;">

   <img src="이미지주소">

</Div>

 

3.레이어의 초기상태를 보이지 않게 숨겨둡니다.

<Div id="Pop" style="position:absolute; left:100px; top:100px; width:100px; height:100px; z-index:1;display:none;">

   <img src="이미지주소">

</Div>

 

4.이제 클릭할 경우 미리 만들어진 저 Pop 라는 레이어를 보여주면 됩니다.

   간단한 스크립트를 작성하겠습니다.

 

   <script> 

      function ViewLayer(){

        document.getElementById("Pop").style.display='inline'

     }

   </script> 

 

5.작성한 펑션을 불러오면 원하시는 작업이 끝이 납니다.

 

   <a href="javascript:ViewLayer();">열어주세요</a>

 

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

 

간단하게 작성한것들이 사용함에 불편함이 있을거예요.

예를들어 열었는 레이어를 닫아준다던가 하는 그런것들요.

 

자 그럼 스크립트를 조금 수정해서 사용하기 편하게 만들어 보겠습니다.

 

   <script> 

      function ViewLayer(){

        //만일 Pop라는 녀석이 닫혀있다면??

        if(document.getElementById("Pop").style.display=="none"){

           //열어주어라

           document.getElementById("Pop").style.display='inline'

        //그렇지 않은 모든 경우라면??

        }else{

           //닫아주어라

           document.getElementById("Pop").style.display='none'

        }

     }

   </script> 

이렇게 작성하시면 한번 클릭하면 열리고 한번 더 클릭하면 닫히게 됩니다.

출처 : http://blog.naver.com/2verworks


<script language="javascript">

 function handlerNum( obj ) {
    //숫자만 입력 받게끔 하는 함수.
    e = window.event; //윈도우의 event를 잡는것입니다.
 
    //입력 허용 키
  if( ( e.keyCode >=  48 && e.keyCode <=  57 ) ||   //숫자열 0 ~ 9 : 48 ~ 57
   ( e.keyCode >=  96 && e.keyCode <= 105 ) ||   //키패드 0 ~ 9 : 96 ~ 105
    e.keyCode ==   8 ||    //BackSpace
    e.keyCode ==  46 ||    //Delete
          //e.keyCode == 110 ||    //소수점(.) : 문자키배열
          //e.keyCode == 190 ||    //소수점(.) : 키패드
          e.keyCode ==  37 ||  //좌 화살표
          e.keyCode ==  39 ||  //우 화살표
          e.keyCode ==  35 ||  //End 키
          e.keyCode ==  36 ||  //Home 키
          e.keyCode ==   9 ||  //Tab 키
          e.keyCode ==   17 || //Ctrl 키
          e.keyCode ==   86 || //v 키
          e.keyCode ==   67  //c 키
      ) {
   if(e.keyCode == 48 || e.keyCode == 96) { //0을 눌렀을경우
    if ( obj.value == "" || obj.value == '0' ) //아무것도 없거나 현재 값이 0일 경우에서 0을 눌렀을경우
     e.returnValue=false; //-->입력되지않는다.
    else //다른숫자뒤에오는 0은
     return; //-->입력시킨다.
    }
   else //0이 아닌숫자
    return; //-->입력시킨다.
   }
  else //숫자가 아니면 넣을수 없다.
   {
     alert('숫자만 입력가능합니다');
   e.returnValue=false;
   }
 }
 
</script>

위 구문을 추가해준다. 혹시나 귀찮아서 ctrl c, ctrl 사용할지도 몰라서 그 키번호 까지 허용....

그러고 나서 사용을 할땐 아래와 같이.. onKeydown='javascript:handlerNum(this)'만 넣어 주면 된다...

<input type ="text" name ="cost" onKeydown='javascript:handlerNum(this)'/>


//db연결
String db1=???;
String db2=???;
//db에서 값을받아서 String에 넣음
//db연결종료
//다음과 같이 db에서 받은 데이터를 radio버튼의 value속성에 넣음
<input name="regState" type="radio" value="<%=db1%>">
<input name="regState" type="radio" value="<%=db2%>">

 

2.
<form method=post action=abc.jsp>
...
<input name="regState" type="radio" value="<%=db1%>">
<input name="regState" type="radio" value="<%=db2%>">
...
<input type="submit" value="전송">
</form>

 

3. abc.jsp
라디오버튼은 같은 이름이 여러개라도 선택된 값만 전송되기 때문에 getParameter로 받으시면 됩니다.
<%
  String radioValue=request.getParameter("regState");
%>

두 날짜의 차이를 얻고 싶으시면, 그렇게 문자열에서 부분만을 뽑아서 계산하는 것보다는 Date 클래스를 이용하는 것이 더 깔끔하고 바람직한 방법입니다.  

다음 코드를 참고하세요. 코드를 보시면 충분히 이해하실 것이라 생각됩니다. 수행하면 결과값이 5가 나옵니다.

 SimpleDateFormat는 지정한 형태로 들어온 문자열을 Date 객체로 바꿔주는 역할을 합니다. 그리고, 이렇게 바뀌어진 두 날짜의 차이를 millisecond 단위로 구하고 이것을 다시 일단위로 바꾸는 것이지요.

import java.text.SimpleDateFormat;
import java.util.Date;

public class DiffOfDate
{
  public static void main(String[] args) throws Exception
  {
    System.out.println(diffOfDate("20031028", "20031102"));
  }

  public static long diffOfDate(String begin, String end) throws Exception
  {
    SimpleDateFormat formatter = new SimpleDateFormat("yyyyMMdd");

    Date beginDate = formatter.parse(begin);
    Date endDate = formatter.parse(end);

    long diff = endDate.getTime() - beginDate.getTime();
    long diffDays = diff / (24 * 60 * 60 * 1000);

    return diffDays;
  }
}

===========================================================================================================
이것 저것 찾아 보다가 입력을 text에서 20090302이런식으로 받을때 저 방법이 제일 좋다

jsp 부분에서 어떤 값을 입력 받을 경우 그 데이터에 대한 유효성 검사등을 위한 form이 있어야하는데 form이 없을 경우에 이러한 에러가 발생한다.
struts-config.xml 파일에서 

<action path="/bbs/bbs2" parameter="method"
    type="bbs.bbs_Action">
   <forward name="search" path=".bbs_search" />
   <forward name="false" path="/bbs/bbs1?method=list" redirect="true" />
  </action>

type 뒤에 name 속성과 input 속성이 있어야만 에러가 발생하지 않는다.

+ Recent posts