크롬80버전 결제 이슈, 영카트5 주요패치 확인!

[테마제작기(13記)] 회원정보 찾기 페이지 개발 1 > 개발자팁

그누보드5
영카트5
매뉴얼
Q & A
제작의뢰
컨텐츠몰
부가서비스
소모임
커뮤니티

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

[테마제작기(13記)] 회원정보 찾기 페이지 개발 1 정보

기타 [테마제작기(13記)] 회원정보 찾기 페이지 개발 1

본문

원글(출처) : 그누보드 테마 제작 13 - 회원정보 찾기 페이지 개발 1

 

오늘은 회원정보 찾기를 만들어보려 합니다.
회원 관련 페이지들도 깨알같이 많네요...
그래도 꾸준히 달려봅니다.

먼저 기본테마의 화면을 살펴봅니다.

3067617148_1593189740.4504.png

기본 테마의 회원정보찾기 화면 (팝업)



음... 팝업으로 나타나는군요.
팝업이라... 레이어로 하는게 맞을 듯 한데,,,
아...
bootstrap의 modal 창을 이용하는게 좋을 것 같습니다.

그럼으로
Metronic Admin Template의 Modal 창을 찾아봐야겠군요.
많은 샘플들을 제공합니다만,
전 Modaless가 아닌 것과 화면 정 중앙에 표시하는 두 가지를 섞을 예정입니다.

3067617148_1593189760.3597.png

Metronic Admin에서 제공하는 많은 Modal 예제 중 기본 사이즈를 이용하기로 했다.

3067617148_1593189878.3531.png

화면 정중앙에 위치하고 기본 크기의 모달 샘플

3067617148_1593189902.7713.png

Modal 창 바깥을 클릭해도 자동으로 창이 닫히지 않는 Modal 샘플

 

 

2시간 삽질을 했네요 ㅠㅠ
Metronic Admin 템플릿의 코드가 오류일거라고는 상상도 못했습니다.

암튼 여차 저차 모달 화면을 준비했습니다.

3067617148_1593189961.9254.png

모바일에서는 캡차코드에 오디어플레이어가 나타난다는걸 첨 보았다는...



이제,
Bootstrap의 modal 모습으로 코드를 변경합니다.

3067617148_1593189988.0338.png

modal 화면으로 변경한 코드

3067617148_1593190009.7233.png

완성된 모습

 


그누의 기본은 일반 팝업창을 띄우면 되었지만,
모달창으로 하다보니 그게 불가능하죠.
어쩔 수 없이 "회원정보찾기"가 필요한 화면마다
include를 하도록 수정해야 하겠습니다.

3067617148_1593190036.0146.png

jquery 관련 에러가 발생하여 화면이 깨진 모습


이번에는 일부 자바스크립트가 로그인 화면에서
호출이 안되는 문제가 발생하여 삽질을 하고 있습니다.
add_javascripte 함수가 로그인 화면에서만 동작하지 않네요.

3067617148_1593190070.7252.png

로그인 화면에서만 출력되지 않는 이유를 찾고 있다.

 


여기서 진짜 시간이 오래 걸리고 있네요.
아 뭘까요... 아... 미치겠구먼...

3067617148_1593190207.1281.png

로그인 화면에서만 스크립트가 노출이 안되는 현상으로 삽질 중...


틀림없이 호출은 되고 있습니다.

3067617148_1593190218.3012.png

로그를 찍어보면, 호출은 틀림없이 호출 하고 있다.


아... 드디어 원인을 찾았습니다.
역시 허무하네요. 이런 실수를 왜 자꾸 하는지...
중간에 캡차함수를 호출하는 부분에서 에러가 나고 있었네요.

3067617148_1593190381.6524.png

화면이 깨지고, 중간에 에러가 나니 $html_process->run() 함수가 실행이 안되는게 당연하지... 에휴...

 

 

위 화면으로 알 수 있는 것은...
kcaptcha.lib.php를 정상적으로 include를 못하고 있다는 거네요.
다시 찾아 떠나봅니다... (이런거 AI가 못해주나...)
에러의 원인은 Modal 창으로 바꾸니,
로그인 화면에 캡차 호출 함수가 들어가게 된 것이고,
로그인화면에서는 캡차 라이브러리를 호출하지 않아 발생한 거였습니다. ㅠㅠ
로그인 화면에 include하면 모든게 해결되겠네요.

3067617148_1593190417.145.png

정상적으로 나타난 스크립트들...

3067617148_1593190600.8662.png

정상적으로 로그인 화면이 보여지는 걸 드디어 확인했다! 감격의 눈물이...

 

 


자꾸 이사님이 술먹으러 나가자고 재촉하네요.
30분만 기달려달라고 했습니다. ㅠㅠ
(아놔 다이어트 중이구만...)

 

이제, 아이디와 비번 찾기 버튼을 누르면,
Modal 창이 뜨도록 코딩을 시작합니다.

3067617148_1593190698.5587.png

버튼을 누르면, 회원정보 찾기 모달창이 뜨도록 스크립트 코딩 작업한 모습


아이고... 여기까지 오는게 왜 이리 힘들었던가!!! ㅠㅠ

3067617148_1593190739.2032.png

정상적으로 회원정보 찾기 화면이 나타난 모습! 정말 감격입니다!!!

 


정상적으로 회원정보 찾기 화면이 나타난 모습! 정말 감격입니다!!!


오늘은 여기까지 마무리해야겠네요.
괜히 Modal창으로 만들려다가 일만 잔뜩 꼬인 느낌입니다. ㅎㅎ
회원정보 확인하는 로직 파일인
/bbs/password_lost2.php 파일도 그대로 사용할 수 없게 되었어요.

 

form의 submit에 의한 페이지 이동이 아닌,
ajax로 호출하여 결과를 json으로 받아오도록 변경해야 하는 상황이네요.
또, 제작중인 테마폴더안에 password_lost2.php 파일을 만들어야 하고요.

 

이 부분은 다음 회차에 진행해야 할 것 같네요. ㅠㅠ

추천1

댓글 전체

전체 5,044
개발자팁 내용 검색

회원로그인

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT