날아라쩡글이의 블로그입니다.

웹스퀘어 개발자과정5(단건 data조회하기) 본문

공부하는파워걸 story/webSquare story

웹스퀘어 개발자과정5(단건 data조회하기)

날아라쩡글이 2022. 3. 1. 20:20
반응형

조회버튼을 이용하여 정보를 조회하기 

앞전에 확인한 것처럼 웹스퀘어는 통신할때 form을 이용해서 전송, 이동하지 않고 submission이라는 객체를 통하여 통신한다.
addSubmission버튼으로 통신할 수 있다. 그러나 해당컬럼에서는 UI가 보이지 않기 대문에 subMission탭을 활용하면 편하다. 
열러진 편집창에서 우선 id를 입력한다. 공백과 -을 사용하지 않는 고유식별자를 사용한다. reference는 request정보를 setting한다.request정보를 담아 줄 data의 객체를 생성하고 지정한다. target은 response정보를 setting한다. respose정보를 담아 줄 data객체를 생성하고 지정한다. URL action은 실제 서버와 통신한url을 연결해준다. mode에서는 asy, syn으로 설정이 가능하고 보통asy로 설정한다. 비동기호출을 권장하므로 syn은 잘 사용하지 않는다. 

앞서 언급한 핸들러가 공통처리함수라면 맨 하단의 submit함수들은 화면 개별 설정 함수이다. submit은 통신 실행직전에 수행, submit-done은 통신정상종료 후 콜백시점에 수행 subit-error는 응답상태코드가 200미만, 400이상일 경우 수행하게 된다.

data를 받는 값은 많기 때문에 일일히 하나씩 사용하는 것보다는 복사하는 방법을 추천한다. 컬럼을 하나만 생성하고 복사할 항목을 모두 복사 후 첫항목에서 붙여넣기를 하면 모든 data가 한번에 복사되는 것을 확인할 수 있다. excel에서 같은 data를 복사하여 붙여넣어도 동일하게 적용이 되는 것을 확인할 수 있다. submissiontest를 통해 값을 확인할 수 있다. submission을 onclick으로 설정할 수 있다. 그러나 주의할 사항은 submission의 id는 컴포넌트와 data객체 와는 다르게 해당 페이지 내에서 전역변수로 인식되지 않는다. 따라서 submission의 id로 API를 접근하려고 하면 아무것도 확인할 수 없다. $p로 접근하여 executeSubmission()을 호출해서 전송할 수 잇다. 파라미터의 값은 1.submissionID : 생성된 submission의 id,String의 형태로 적용 2.requestData-requestdata를 의미하며, 이미submission의 reference에서 requestData의 객체를 지정하였으므로 또 설정할 필요없다. 3. 통신이 수행되는 동안 disable의 처리할 객체의 id를 지정한다. 이미 pocessMessage의 기능을 통해 적용했으므로 또 설정할 필요는 없다. 

property에서 defaultvalue의 값에 값을 적용하면 설정한 값이 기본적으로 가는 것을 확인할 수 있다. 

하단에 있는 submit의에 값을 입력하면 자동으로 script에 작성이 되는 것을 확인할 수 있다. script로 바로 이동하는 것을 알 수 있으며 해당 부분에 API를 이용한 script를 작성하면 본 submission이 실행하기 직전에 먼저 수행하게 된다. 이부분을 이용하여 data의 값을 미리 설정할 수 있다. set이라는 api를 사용하여 값을 할당할 수 있다. 

조회된 data를 화면에 연동하는 방법
결과를 담은 dataMap과 화면의 컴포넌트를 연결하는 방법은 dataMap의 항목과 디자인의 컴포넌트와 드래그하는 방식으로 연결하면 된다. 이와 같이 연결하시려면 design tooltip을 통해 연결된 referenccee의 정보가 초록색으로 표시되고, property의 ref라는 항목이 data:해당컬럼이름으로 자동 셋팅되어져있음을 확인할 수 있다. 

화면에 입력값을 받아서 조회하는 방법
조회영역에 조회조건을 담을 컴포넌트를 추가할 예정이다. 조회할 컴포넌트와 입력값이 Mapping이 되도록 reference로 서정한 dma의 컬럼명이 되도록 드래그를 통해 바인딩한다. 다음으로는 최대값, 최소값, 증감등을 설정할 수 있다. increment -증감으로 설정 1로 설정하면 1씩 증가된다. max와 min을 설정할 수 있다.  조회값을 통해서 통신할 예정므로 submission의 sumit을 통해 초기값을 설정한 부분은 삭제한다. 

submission에 reference와 target을 지정한 id를 확인한다. controller가 mapping되어 있는 부분이 과 referene에 값이 동일한다. 컴포넌트의 속성값도 변경한다고 창이 뜨면 OK로 클릭하면 바인딩의 정보가 자동으로 변경된것을 확인할 수 있다. servlet에서 사용하는 id와 화면에서 사용하는 id가 다를 경우 error가 발생되는 것을 확인할 수 있다. key라는 부분에 sevlet에서 사용하는 id를 적용한다. 그리고 test를 진행한다면, 정상적으로 test가 운용되는 것을 확인할 수 있다. 

반응형
Comments