.serialize() - jQuery API : http://api.jquery.com/serialize/

$('form').submit(function() {
  alert($(this).serialize());
  return false;
});

오늘 jQuery를 가지고 스크립트를 작성하다가 jQuery를 이용해서 form 객체를 호출해서 jquery.submit() 메서드를 실행했는데 안먹히는 거다. 왜 그런거지!? 하면서 끙끙거리면서 고민하다가 옆에 계신 실장님께 도움을 요청하여 왜그런지 분석하다가 jQuery Document에 있는 걸 그대로 따라한 소스를 보시고서는

이건 센스가 없는거에요. 이 코드가 작동되는 것이 맞지만, 굳이 이렇게 할 필요가 있을까요?
이렇게 하면 될텐데?

라고 하시며 조언을 해주시는데...

document.forms['form'].submit();

이건 된다.

$('#form').submit();

이건 안된다.

$('#form').get(0).submit();

이건 된다. 단, 이렇게 get(0)으로 꺼내게 될 경우에는 jQuery에서 다루는 객체가 아니라 실제 form 객체이기 때문에 submit() 메서드는 jquery에서 다루기가 어려워진다. 즉, 복잡시러워지는거다. 문득 생각난건데.

$($('#form').get(0)).submit(function() {

});

요렇게하면 쓸 수 있지 않을까란 잡생각도 잠시 해봤다.

가만히 보고 있으니, 굳이 form.submit()을 실행하는 이벤트를 가로채서 ajax처리할 필요가 없었다.

var serializeObject = $form.serialize();

로 form에 있는 정보를 문자열로 직렬화해서 ajax로 넘기면 되는 거였다. 흠.


사실 그 앞에서 jQuery를 이용해서 동적으로  document.body에다가 form을 생성하고 거기에 appen로 붙이면서 form객체를 만들고 있었다. 이렇게 만들어진 form 객체를 jQuery를 이용해서 다루려고 했던 것인데, 이 부분에서 내가 생각했던 의도와는 다르게(원래 그렇게 되는 게 맞는 것이었겠지) 동작하고 있었던 것이다. 오류메시지도 나타나질 않으니 당황스러웠기도 하고 황망했다.


난 (개발) 센스가 부족하다. ㅠㅅ-)

센스만점이 되는 그날까지 부지런히 노력하자.




오늘의 교훈 : 난 브라우저(클라이언트)에서 다루는 객체의 계층구조나 동작원리를 제대로 이해하지 못하고 있다는 것이다. 그저 jQuery를 이용해서 다루는 정도가 아니라, 충분히 머리 속에서 동작원리를 이해하고 상상해볼 수 있는 수준까지 도달하기 위한 노력을 잊지 말자.

   제가 만들고 싶은 것은 API를 이용한 매쉬업 형태로 개발을 해야할 것 같습니다. 그러기 위해서는 자바스크립트를 기반으로 하는 것이 좋을 듯 하구요. 과거에 단순히 복사하고 붙여넣기 방식으로 구현하면 된다고 생각했던 자바 스크립트였는데, 지금은 공부해야할 것이 자바 만큼이나 많은 분야가 되어버리는 군요. ㅡㅅ-); 그나저나... 스-);; 문제로군요. 우분투에서는 플래시로 작성되어 있는 영상들이 정상적으로 작동을 하지 않습니다. OTL... VirtualBox로 윈도우 XP를 사용하면서 시스템 자원이 모두 그쪽에서 점유하고 있어서 였을까요? 우분투 업데이트를 마치고 나니까 정상적으로 플래시에서 소리가 나는군요. 으흠!?

강연하시는 분(Douglas Crockford)의 블로그 : http://www.crockford.com/




이 글은, 제가 이해해서 올린다기 보다는 이해하기 위해, 올해 안에 공부해야할 것들 중 하나인 JavaScript 부분에 대한 내용을 기록해두는 것이라고 해도 될 것 같습니다. ㅠㅅ-) 공부해야할 것들은 점점 많아져 가고 머리에 주입할 수 있는 주입량은 한계가 있고... 이것 참 난감하네요. 매쉬업이 발달하면 하게 될수록 매쉬업 언어로서의 자바스크립트도 그 영역을 더욱 넓혀가게 될 것 같군요.

+ Recent posts