input 데이터 팝업창 띄워 가져오기

-------------------------------------------------------------------------------------

현재 블로그 이사 하였습니다.

https://100sy.co.kr/

와서 더 많은 자료 확인부탁드려요

-------------------------------------------------------------------------------------

 

 

이런 형식으로 사람을 찾아서 넣어 입력해서 input 제출하는 form 작성중임

어느정도 데이터가 많고, 기존 데이터에서 골라야 하기에 select 보다 그냥 창띄워서 가져오는게 더 좋다고 생각하여 이렇게 만들었음.

 

                <div>

                    <label for="engineerId">엔지니어:</label>

                    <input type="text" id="engineerName" name="engineerName" required readonly>

                    <input type="hidden" id="engineerId" name="engineerId" required>

                    <button type="button" onclick="openEngineerPopup()">엔지니어 찾기</button>

                </div>

 

값으로는 표기할 enginerName, 실제로 전달할 engineerId 를 hidden 값으로 가져와야 함

 

 

script 내용

 

   

        function openEngineerPopup() {

            const width = 1200;

            const height = 800;

            const left = (screen.width / 2) - (width / 2);

            const top = (screen.height / 2) - (height / 2);

            // 팝업 창 열기

            const popup = window.open(

                'engineer_search',

                '엔지니어 검색',

                `width=${width},height=${height},top=${top},left=${left}`

            );

            // 팝업 창이 닫혔을 때 처리 (옵션)

            popup.onbeforeunload = function () {

                const engineerId = popup.document.getElementById('selectedEngineerId');

                const engineerName = popup.document.getElementById('selectedEngineerName');

                if (engineerId) {

                    // 부모 창의 입력 필드에 고객사 이름 설정

                    document.getElementById('engineerId').value = engineerId.value;

                    document.getElementById('engineerName').value = engineerName.value;

                }

            };

        }

 

 

popup 변수에 window.open 함수를 추가

window.open("url주소", "팝업창에 표시될 title내용", "팝업창 크기및위치")

 

그럼 engineer_search 항목에서는?

->> Controller 에서 이제 데이터담아서 해당 url인 engineer_search 페이지에 뿌려두는건 알아서 하고

 

-------------------------------------------------------------------------------------

현재 블로그 이사 하였습니다.

https://100sy.co.kr/

와서 더 많은 자료 확인부탁드려요

-------------------------------------------------------------------------------------