ax5ui / ax5ui-grid

Javascript UI Component - GRID ( Excel Grid, jqGrid, angularjs grid, jquery grid, SlickGrid, ag-grid gridify)
http://ax5.io/ax5ui-grid/demo/index.html
MIT License
99 stars 36 forks source link

그리드 컨텍스트 메뉴의 popupFilter 사용시 선택된 항목이 다릅니다. #38

Closed groovedk closed 7 years ago

groovedk commented 7 years ago

그리드에 컨텍스트 메뉴로 트리뷰에서의 이동 및 추가삭제를 구현하려고 합니다. popupFilter 속성으로 부모의 위치에 따라서 나오는 메뉴를 변경하고 있는데 return false 로 컨텍스트메뉴의 아이템을 제외하면 항목과 인덱스가 맞지 않습니다.

예를들어 5개 메뉴중(라인포함 6개) 중간 3개를 제외하고 3,4,5 메뉴중 두번째 클릭시 제외하기 전 인덱스에 해당하는 메뉴가 선택된다고 나옵니다.
아래 코드를 예로 들면 3,4,5 (이동, 구분선, 추가) 가 있을때, 이동을 누르면 원 메뉴인 "위로"(필터링 되지 않은 메뉴의 첫번째 인덱스)가 선택됩니다.

코드는 그리드의 컨텍스트부분만 발췌해서 올립니다.

contextMenu: {
    iconWidth: 20,
    acceleratorWidth: 100,
    itemClickAndClose: false,
    icons: {
        'arrow': '<i class="fa fa-caret-right"></i>'
    },
    items: [
        {label: "위로", act_tp:"moveUp", icon: '<i class="fa fa-arrow-up" aria-hidden="true"></i>'},
        {label: "아래로", act_tp:"moveDown",  icon: '<i class="fa fa-arrow-down" aria-hidden="true"></i>'},
        {label: "이동", act_tp:"move", icon: '<i class="fa fa-arrows" aria-hidden="true"></i>'},
        {divide: true},
        {label: "추가", act_tp:"C", icon: '<i class="fa fa-plus" aria-hidden="true"></i>'},
        {label: "삭제", act_tp:"D", icon: '<i class="fa fa-minus" aria-hidden="true"></i>'}
    ],

    popupFilter: function (item, param) {
        // console.log("popupFilter-------");
        // console.log(item, param);

        var listItem = param.item;
        var parentItem = _this.getParentNode(listItem);
        var hsArr = listItem["__hs__"].split(".");
        // console.log(hsArr);

        if (listItem.parent_cd == "top"){
            return (item.act_tp == "C");
        }else{

            var rtnFlag = true;

            if (item.act_tp == "moveUp"){
                rtnFlag = !( ax5.util.number(hsArr[hsArr.length-1]) == 0) ;
            }else if (item.act_tp == "moveDown"){
                rtnFlag = !(parentItem["__children__"].length-1 == ax5.util.number(hsArr[hsArr.length-1]));
            }else if (item.act_tp == "move"){
                rtnFlag = !(listItem.parent_cd == "top");
            }else if (item.act_tp == "C"){
                rtnFlag = true;
            }else if (item.act_tp == "D"){
                rtnFlag = !(listItem.parent_cd == "top");
            }

            return rtnFlag;
        }
    },

    onClick: function (item, param) {
        console.log("contextMenu onClick--------------");
        console.log(item, param);

        var listItem = param.item;
        var act_tp = item.act_tp;

        var hsArr = listItem["__hs__"].split(".");
        var siblingIdx = ax5.util.number(hsArr[hsArr.length-1]);

        console.log(siblingIdx);
        console.log(act_tp);

        if (act_tp == "C") {

        } else if (act_tp == "D") {

        } else if (act_tp == "moveUp") {

        } else if (act_tp == "moveDown") {

        } else if (act_tp == "move") {

        }

        _this.target.contextMenu.close();
    }
}
thomasJang commented 7 years ago

테스트를 해보았는데요. 각 return을 체크 해보셔야 할 것 같네요. popupFilter의 return true인 메뉴만 노출 되고 있습니다.

thomasJang commented 7 years ago

ax5menu filtered 된 상태에서 버그가 있었습니다. 수정된 버전이 커밋 되었습니다.

groovedk commented 7 years ago

확인되었습니다. 캄사합니다!