[ SAPUI5 ] Rule Builder Control / Decision Table - 3

○ 페이지 컨트롤러 설정 이어 하기

    - [ Page.control.js ]

handleEditButton: function () {
			var oEditButton = this.byId("editButton");
			var oRuleBuilder = this.byId("ruleBuilder");
			var bEdit = (oEditButton.getText() === "Edit");
			oRuleBuilder.setEditable(bEdit);
			oEditButton.setText(bEdit ? "Display" : "Edit");
}

 

      1) oEditButton :  'editButton'을 id로 둔다.

      2) oRuleBuilder : 'ruleBuilder'를 id로 둔다.

      3) bEdit : 'oEditButton'을 'getText()' 메소드를 사용해 가져오는 텍스트가 'Edit'과 같은 값을 가지게 한다.

      4) oRuleBuilder : 'bEdit' 변수를 매개로 하여 편집이 가능토록 한다.

      5) oEditButton : 텍스트 값을 'bEdit'이 'Display'이거나 'Edit'이 되도록 설정한다.

---

onAfterRendering: function () {

        var messageHandler =function(){
                var msg = 'Line action pressed';
                MessageToast.show(msg);
            };

    // Line actions are not supported in this demo
    var oRuleBuilder = this.byId("ruleBuilder");
    var oDecisionTable = oRuleBuilder.getAggregation("_rule");
    var oToolbar = oDecisionTable.getAggregation("_toolbar");
    var arrContent = oToolbar.getContent();

 

      6) messageHandler

        * msg : 'Line action presssed'의 메세지를 보여주도록 설정한다.

        * 'MessageToast'의 'show()' 메서드에 'msg'를 파라미터로 두어 해당 메세지를 띄울 수 있도록 한다.

       7) oRuleBuilder

        * oRuleBuilder : 'ruleBuilder'를 아이디로 둔다.

        * oDecisionTable : 'getAggregation()'를 사용해 '_rule'을 하위 컨틀롤러로 두는 'oRuleBuilder'로 초기화 한다.

        * oToolbar : '_toolbar'를 하위 컨트롤러로 두는 'oDecisionTable'로 인스턴스화 해준다.

        * arrContent : 'getContent()' 메서드를 사용하는 'oToolbar' 값으로 설정한다.

---

 for (var i = 0; i < arrContent.length; i++) {
        if (arrContent[i].getMetadata().getName() === "sap.m.Button") {
            arrContent[i].detachPress(arrContent[i].mEventRegistry.press[0].fFunction, 
            arrContent[i].mEventRegistry.press[0].oListner);
            arrContent[i].attachPress(messageHandler);
        } else if (arrContent[i].getMetadata().getName() === "sap.m.MenuButton") {
            var oMenu = arrContent[i].getMenu();
            oMenu.detachItemSelected(oMenu.mEventRegistry.itemSelected[0].fFunction, 
            oMenu.mEventRegistry.itemSelected[0].oListner);
            oMenu.attachItemSelected(messageHandler);
        }
    }

 

      8) 'arrContent' 문자열의 길이만큼을 가지고 for 반복문을 생성한다.

        * 'arrContent[]' 배열함수의 meta data의 name 값을 가져와 'sap.m.Button'의 값과 같다면

        * 'detachPress()' 이벤트를 통해 이전에 등록된 이벤트 리스너를 제거하고

        * 'attachPress()' 메서드를 사용해 위에서 설정해둔 'mesageHandler'의 메세지를 추가한다.

        * 반대로 'sap.m.MenuButton'을 name으로 둔다면 'getMenu()' 메서드를 사용해 해당요소의 메뉴를 가져와

        * 'detachItemSelected()' 메서드로 이전에 등록된 이벤트 리스너를 제거하고

        * 'attachItemSelected()' 메서드로 새로운 이벤트 리스너를 등록한다.

---

loadJSON: function(mPath, callback) {
            var xobj = new XMLHttpRequest();
            xobj.open('GET', mPath + "localService/rule/responses.json", true);
            xobj.onreadystatechange = function() {
            if (xobj.readyState == 4 && xobj.status == "200") {
                    callback(JSON.parse(xobj.responseText));
            }
            };
            xobj.send(null);
}

 

      9) loadJSON

        * 'mPath'와 'callback'을 파라미터로 둔다.

        * xobj : 'XMLHttpRequest()' 메서드로 초기화 한다.

        * 'mPath'와 [ respoanse.json ] 경로를 합친 경로 값을 'open()' 한다.

        * 'redyState' 값이 '4'이고 'status'가 '200'인 경우에 'responseText'를 'callback'하고

        * 반대로 조건과 맞지 않다면 아무런 메세지도 띄우지 않는다.

What is the 'httpRequest.readyState == 4'?

---

Next Stage : RuleBuilder Control / Decision Table - 4

Rule Builder Control / Decision Table - 4

반응형