다음의 코드는 서버로 HTTP request를 날린 후 response로 JSON데이터를 받아 alert를 찍어주는 부분이다.$.ajax({type : "GET",url : "${pageContext.request.contextPath}/json.do",dataType : "json",data : "adsId=" + adsId + "&cmd=" + cmd,success : function(json) { if (json.isSuccess) { alert(json.msg); } alert(json.info.adsName); alert(json.info.imp); alert(json.info.click);}, error : function(e) { alert("처리중 장애가 발생하였습니다."); } });서버..
test.co.kr 이라는 사이트에서 dev.co.kr 이라는 사이트에 있는 정보를 Ajax 기술을 이용하여 요청을 보낼 때 cross domain policy에 의해 브라우저가 요청을 막는다.즉, 도메인이 다르면 요청을 보낼 수 없다. 위와 같은 상황을 우회하여 해결할 수 있는 방법은 jquery에서 jsonp를 이용하는 것이다.한 가지 주의해야 할점은 jsonp는 HTTP GET 방식만 지원한다. jsp 파일 $(document).ready(function() { }); function getJsonTest1() { $.getJSON("http://jsonp.localhost:8081/jsonpTest?id=user&callback=?", function(data) { alert(data.id + "..
간혹 아래와 같이 html table을 merge한 후 화면에 보여줘야 하는 경우가 있다. 전에는 for문 돌리며 if 처리를 통해 해결했는데 다음과 같이 DOM을 이용하면 코드를 이해하기 쉽고, 유지보수하기 편해진다. 다음은 샘플 코드이다. 여기서 중요한 부분은 꼭 merge할 cell은 정렬이 되어 있어야 한다는 것이다. (DB에서 query 조회 시 order by를 이용하여 정렬 처리) 정렬이 안 되어 있는 상태에서 merge를 하게 되면 다음과 같이 원하지 않는 결과를 가져올 수 있다. 이유는 코드를 확인해 보면 안다.
radio 버튼 처리를 위한 테스트 코드를 작성해 보았다. 초기 로딩 화면은 다음과 같다. 테스트 코드는 다음과 같다. mWeb inApp HTML5 this is M area mobile web this is I area inapp this is H area html5 여기서 한가지 고민되는 부분이 있었다. radio 버튼을 클릭할 때마다 text를 변경하며 노출해야 하는데 위의 테스트 코드와 같이 hide(), show()를 이용하여 처리를 하다보면 버튼 항목이 추가되었을 때 늘어난 항목 만큼 조건절에 모두 추가해 줘야 한다. 그래서 루프를 이용하여 다음과 같이 처리하였다. 조금은 코드가 깔끔해 졌다. ^^ 개발을 하다보면 시간에 쫓겨 이와 같은 고민을 하지 못하고, 그냥 지나쳐 버리곤 했는데 학습 ..
jquery를 이용하여 checkbox 핸들링 테스트를 해보았다. 체크 박스 전체 석택체크 박스 전체 해제체크 되어 있는 값 추출서버에서 받아온 데이터 체크하기 (콤마로 받아온 경우) 1번째 checkbox2번째 checkbox3번째 checkbox4번째 checkbox 한 가지 고민스러운 것은 서버에서 받아온 데이터가 콤마가 아닌 리스트 형태일 경우 어떻게 처리하는 것이 좋을까 이다. service layer에서 리스트 형태의 checkbox 데이터를 콤마 형태로 가공한 후 view에 던져줘야 할까?아니면 리스트로 받은 데이터를 view에 던져주어 데이터 가공 작업을 위임할까? okjsp에 질문올려서 다른 분들은 어떤 방법을 사용하고 있는지 알아봐야 겠다.
tree를 이용하여 화면을 개발하였는데 jquery를 잘 모르다보니 초반에 너무 삽질을 많이 했다. 지금은 웬만큼 익숙해졌지만 좀 더 간결하고 깔끔하게 짤 수 있는 방법을 찾기 위해 지속적인 테스트를 해보려고 한다. 브라우저는 크롬을 사용하였고, console.log 를 이용하여 디버깅을 하였다. 이제는 jquery selector에 대한 부담이 없어졌다. 이제 클라이언트 개발도 어느 정도 자신감이 생기기 시작했고, 두려움이 사라지고 있다. 물론 이것만 알았다고 해서 자만하지 말고, 더더욱 발전할 수 있도록 반복 숙달하자. 결과 화면