AJAX: PROTOTYPE SETSTYLE()

Prototype Framework에서는 Element에 css가 아닌 자바스크립트로 스타일을 적용할 수 있게 하는 setStyle()이라는 메서드를 제공하고 있다. 물론 Element.style.display 같은 식으로 스타일에 접근하거나 할 수 있지만 setStyle()의 좋은 점은 css에서 적용하는 것처럼 스타일을 한꺼번에 적용할 수 있다.

Element의 Selector는 당연히 이것저것 있지만 가장 기본적인 getElementById를 가지고 설명하자.

(Language : javascript)
$("elementID").setStyle({
    'position': 'relative',
    'width':    '100px',
    'height':     '100px',
    'overflow': 'hidden',
    'border':   'solid 1px #808080'
});

마치 CSS를 사용한 것처럼 익숙한 스타일로 한꺼번에 스타일을 적용할 수 있다. px를 사용할 때 100px처럼 붙혀서 쓰는 것이 좋다. px앞에 공백이 있으면 브라우저에 따라 안 먹을 수 있다.

스타일 프로퍼티쪽은 꼭 홑따옴표(')로 묶어주지 않아도 상관없기는 하지만 float처럼 reserved word와 겹치는 경우에는 문제가 생길 수 있기 때문에 이런 충돌은 홑따옴표로 묶어서 해결할 수 있다.

근데 setStyle()을 사용할 때 주의할 점은 -가 붙는 CSS 프로퍼티에 대한 부분이다.

CSS에서도 내부 스타일과 외부 <style&rt;태그로 할때 프로퍼티의 이름이 다른 경우들이 좀 있는데 그것처럼 여기서도 주의해야 할 부분이 있다.

background-color 이나 font-size처럼 CSS 프로퍼티가 - 가 붙는 경우에는 backgroundColor 나 fontSize 처럼 카멜방식으로 - 가 없이 작성해 주어야 동작을 한다. 모든 - 가 붙는 프로퍼티가 다 그런지 까지는 확인하지 못했지만 위의 2가지는 확실히 - 없이 작성해 주어야 한다. 대소문자를 가리기 때문에 반드시 위와같은 카멜방식이어야 한다.

이것때문에 한참 해맸다. 처음에는 동적으로 생성한 엘리먼트에는 setStyle이 안 먹나 해서 이것저것 했었는데 결국 스타일이 적용 안된게 저 문제 때문이었다.


덧) 각 스타일은 콤마(,)를 이용해서 구분하는데 마지막에도 콤마를 붙혀주는 실수를 할 경우 Firefox에서는 잘 돌아가지만 IE에서는(내 경우는 7) 에러가 난다. 더군다나 콤마때문에 렌더링 오류가 나는데 생뚱맞은 곳에서 오류메시지가 나기 때문에 디버깅 하기도 쉽지 않다. 콤마에 주의!!

덧) (2008.3.6) CSS의 프로퍼티를 -를 쓰지 않고 대신 카멜방식처럼 대문자로 이어붙히는 것은 자바스크립트 자체의 특징으로 특정 프로퍼티에 대시(-)를 사용할 수 없게 되어있다고 한다. 프로토타입의 특징은 아니었다.

http://blog.outsider.ne.kr/114에서 인용

SCRIPT: EDITOR

http://www.fckeditor.net/에서 다운 받아서
사용 할 수 있다.
java에서는 조금 귀찮은 커스터 마이징이 필요하다.
http://blog.naver.com/devstory/130007533735

JAVA: USE ORACLE CLOB IN JDBC

public static Clob getClob(String clobValue, Connection conn) throws Exception{
 Clob newClob= null;
 if(clobValue!=null) {
  try{
   newClob = oracle.sql.CLOB.createTemporary(conn, true, oracle.sql.CLOB.DURATION_SESSION);
   if(newClob!=null) {
    ((oracle.sql.CLOB)newClob).putString(1, clobValue);
   }
  }  catch (Exception e){
  }
 }
 return newClob;
}

입력 시에는 이런식으로 Clob타잎을 생성한후에 preparestatement의 setClob()을 사용 하면 된다.
버그가 있다고는 하는데.. 아직 경험해 보지는 못했다.
결국 경험하게 되었다. pooling된 connection에서는 작동하지 않는다.
다시 해결 방법을 찾았다. http://wiki.caucho.com/Database_FAQ67890

Will the pool be automocatically set to queue if number of connections requested
is more than max connections?
You mean block the waiting thread. Yes.
"queue" doesn't make sense in this context.
If you're using the
PooledDataSource instead of the Driver SPI, you'll get the Oracle connection
directly.
Otherwise, you need to case the Connection to
com.caucho.sql.UserConnectionAdapter and call getConnection() to get the
underlying Oracle connection.

코드는 이렇게 바뀐다.

   newClob = oracle.sql.CLOB.createTemporary   (((com.caucho.sql.UserConnectionAdapter)conn).getConnection() , true, oracle.sql.CLOB.DURATION_SESSION);

resin의 connection adapter에서 oracle의 connection을 반환하여 처리 한다.

그리고 조회 시에는 이런 식으로 받아 올 수가 있다. CLOB의 stringValue()라는 녀석을 쓰면 딱 좋겠지만 써보면 'java.sql.SQLException: Conversion to String failed' 에러를 내버린다.

다시 에러 발생. jennifer를 사용 할 경우 rapper class가 2중으로 되어 버려서 위의 방법으로
underlying connection을 얻을 수 없다.
http://www.caucho.com/resin-javadoc/com/caucho/sql/UserConnection.html
일단 자료 수집중.

resin 3.0 이상에서는 UserConnection 에 unwrap() method가 있어서 별 문제 없어 보이긴 하나 현제 환경은 resin 2.1이라는게 문제.

   CLOB c = (CLOB)rs.getClob(1);
   matchInfo.setIntro( c.getSubString(1, (int)c.length()) );

베베 꼬아서 jdbc를 개발한 오라클 놈들에게 박수를 보내며...

이게 도움이 될지는 모르겠지만...
// first, create statement to insert
OraclePreparedStatement ps;
ps = (OraclePreparedStatement )con.prepareStatement("INSERT INTO Test (text) VALUES (?)");

// create a temporary CLOB and write to it
CLOB clob = CLOB.createTemporary(con, true, CLOB.DURATION_SESSION);
Writer out = clob.getCharacterOutputStream();
out.write(myLongText);

// set the CLOB on the OraclePreparedStatement and execute
ps.setCLOB(1, clob);
ps.executeUpdate();


이것도

AJAX: NOTICES TO ELEMENT MOVING

function bindMatch(){
 var allNodes = $("src");
 for(i = allNodes.length - 1; i >= 0 ; i--) {
  if (allNodes[i].selected == true){
   $("target").appendChild(allNodes[i]);
  }
 }
}

이런식으로 element를 이동 시킬때는 밑에서 부터 이동 시켜야 한다.
참조하는 [i]의 값이 변하기 때문이다.