본문 바로가기
Web/WebSquare

[WebSquare] 웹스퀘어 5 컴포넌트 관련 select,checkbox, radio 동적 바인딩

by 평범한kiki 2023. 5. 27.

* select,checkbox, radio 동적 바인딩
1. 값직접 입력
    ui_gender.addItem("M", "남자", 0);
    ui_gender.addItem("F", "여자", 1);
    ui_gender.setValue("M");
2.  데이터셋을 이용해 동적데이타바인딩
    var jsonData = [{"code":"01","name":"총괄"}
                   ,{"code":"02","name":"담당"}
                   ,{"code":"03","name":"디자인"}
                   ,{"code":"04","name":"개발"} ];
    dataList_role.setJSON(jsonData, false);
    ui_role.setNodeSet("data:dataList_role", "name", "code");
3.  submission와 dataCollection 이용해서 디비 조회
- 파라미터 넣어줄려면 submission에서 제공하는 submit 함수 생성해서 그안에서 dataCollection에 set 한다
set- 특정 key값에만 원하는 data 적용
setArray - 전체 data를 Array 형태로 적용
setXML - 전체 data를 XML 형태로 적용
setJSON - 전체 data를 JSON 형태로 적용 
setEmptyValue - 적용된값 삭제
- 페이지 로드시 디비 조회해서 code값 셋팅해준다
scwin.onpageload = function() {
    $p.executeSubmission("sub_codePosition"); //서브미션 호출
}
- 한번에 여러코드 조회시 submission 활용
submission target에 조회결과 받을 dataCollection 추가로 여러개선택, 파라미터 ,로 구분해서 보낸다
- js 이용하기
/ws5/WebContent/js/eduCommon.js의 com.setCommonCode 이용하기
com.setCommonCode([
{"code":"02","compID":ui_rank2.getID()},
{"code":"101","compID":ui_gender2.getID()},
{"code":"19","compID":ui_role2.getID()},
]);
console.log(ui_rank2.getID()); //-->mf_ui_rank2가 된다. 아마 화면 id를 구하는듯듯