ax5ui / ax5ui-modal

Javascript UI Component - Modal (JavaScript Modal ) / jQuery / Bootstrap / Modal
http://ax5.io
MIT License
19 stars 0 forks source link

modal창에서 modal 창을 추가로 호출하는 방법 #2

Closed DaeHyeon-Kim closed 7 years ago

DaeHyeon-Kim commented 7 years ago

modal창에서 버튼 선택시 추가로 modal 창을 띄우는 방법이 있나요? modal창 화면 내부에서 modal창을 추가로 호출하려 하니까 그냥 링크이동이 됩니다.

thomasJang commented 7 years ago

modal창을 iframe으로 사용하시는 건가요? 만약그렇다면 iframe은 별도의 웹 페이지 이니까 그냥 구현하시면 되겠구요.

div로 하신다면 zIndex값을 다르게한 modal 인스턴스를 하나더 선언하고 호출하면 되겠습니다.

DaeHyeon-Kim commented 7 years ago

axboot를 활용하여 모달창을 호출 중입니다. PROJECT_MATERIAL 창을 먼저 호출 후 해당 창에서 SAMPLE-MODAL 창을 호출하였으나 창이 새로뜨지않고 링크이동만 되는 현상이 생기고 있습니다. ` axboot.modal.open({ modalType: "PROJECT_MATERIAL", param: param, zIndex: 5010, header:{title: " "}, sendData: function(){ return {}; }, callback: function (data) { // caller.formView01.setEtc1Value({ // zipcode: data.zipcode, roadAddress: data.roadAddress, jibunAddress: data.jibunAddress // }); this.close(); } });

    axboot.modal.open({
        modalType: "SAMPLE-MODAL",
        param: "",
        zIndex: 5020,
        header:{title: " "},
        sendData: function(){
            return {};
        },
        callback: function (data) {

// caller.formView01.setEtc1Value({ // zipcode: data.zipcode, roadAddress: data.roadAddress, jibunAddress: data.jibunAddress // }); this.close(); } });

MODAL CONFIG #################################################### "PROJECT_MATERIAL": { width: 1024, height: 500, zIndex : 5010, iframe: { url: "/jsp/project/project-material.jsp" } }, "SAMPLE-MODAL": { width: 500, height: 500, zIndex : 5020, iframe: { url: "/jsp/_samples/modal.jsp" }, header: false }, MODAL CONFIG #################################################### `

thomasJang commented 7 years ago

axboot.modal 모달이라는 오브젝트가 한개만 만들어지도록 설계가 되어 있어서 그렇습니다.

https://github.com/axboot/ax-boot-framework/blob/master/ax-boot-admin/src/main/webapp/assets/js/axboot/src/modules/modal.js#L108

여기를 보면 window.axModal.open(modalConfig); 해주거든요. 그리고 axModal은 https://github.com/axboot/ax-boot-framework/blob/master/ax-boot-admin/src/main/webapp/assets/js/axboot/src/modules/preparePlugin.js#L49 여기서 준비되어 있구요.

별도의 서브 모달을 만드시려면 axboot.modal을 사용하지 마시고 http://ax5.io/ax5ui-modal/demo/index.html 를 참고하여 페이지에서만 사용하는 modal인스턴스를 만드시거나. axboot preparePlugin.js파일에서 별도의 modal 인스턴스를 선언 후 사용하시기 바람니다.