봉봉의 개인 블로그

2017-04-05-E 본문

학원에서 배운것들/TEA - E

2017-04-05-E

봉봉이네 2017. 4. 5. 17:25

*404에러는 경로 에러이다.*

htmllayout24에 있는 user_insert_form.jsp 와 user_list01.jsp가 있는데 user_insert_form.jsp에

*뒤의 action=user_list01.jsp은 가입버튼을 눌렀을때에 user_list01.jsp로 넘어가게 된다.

아래와 연결해서 43번 부분은 가입버튼을 만드는 부분인것이다.*

 

37번 부분 처럼 바꾸었을때 method="post"부분이 없게 되면 get 처리 방식으로 넘어가게 된다.

get처리 방식으로 실행을 해봤을때는

 http://localhost:8080/htmllayout24/user/user_list01.jsp?u_id=&u_pw=&u_name=&u_phone=&u_email=

처럼 가입 버튼을 눌렀을때의 주소창에 입력한 데이터 값이 들어가면서 넘어가게 된다.

하지만 사진과 같이 mothod="post" 입력해주고 실행하게 되면

 http://localhost:8080/htmllayout24/user/user_list01.jsp

처럼 주소창에 입력한 데이터 값이 보이지 않게 된다.

 

*tip

https://www.w3schools.com/html/html_classes.asp

https://www.w3schools.com/html/exercise.asp?filename=exercise_tables5

지금부터는 위 두 링크를 참고해서 진행하자*

 

index.jsp파일 내용 복사해서 user_list01.jsp안에 붙여 넣는다.

그리고 메인화면입니다<br><br>부분을

전체 회원 리스트<br><br>로 바꿔서 집어넣는다.

그런다음

*<style>부터</style>까지를 말하고 그것과 언급된것은 2번째 링크에 있다.*

사진과 같이 head에 붙여 넣는다. html에서 가지고 온것을 붙여넣고

*tip 주석은 Ctrl+Shift+/ 으로 만들고 Ctrl+Shift+\ 로 없앨수있다 9번 부분이 주석이다.*

body 안에 있는 46~ 62번까지 처럼 넣어준다

(즉, 적용할 leftcolumn 이러던지 rightcolumn아래에 붙여 넣어주면 된다는것이다.)

그런다음

저런식으로 넣어주고 실행을 하게 되면

이런식의 표현이 가능해진다.

그다음으로 index.jsp파일을 열고

사진과 17~ 26부분과같이 header 부분을 바꿔주고

나머지 user_insert_form.jsp와 user_list01.jsp안에도 header 부분에 똑같이 적용해주게 되면

index.jsp를 실행햇을때 이 화면에서 01회원가입을 누르게 되면

회원 가입 창으로 넘어가게 되고 02회원 리스트를 누르게 되면

회원 리스트로 넘어가고 또한 회원 가입창에서도 회원 리스트를

갈수 있으며 회원 리스트에서도 회원 가입창으로 갈수있게 된다.

*https://www.w3schools.com/html/default.asp

이 사이트 에서도 head 부분과 body부분을 유의해서 보자.*

지금 까지 배운걸 응용해본다면

64~67까지의 부분처럼 적게 되면

이런식의 상자안에 버튼이 들어오는 구조도 만들수잇다.

그리고 수정버튼을 누르면 수정화면으로 넘어가게 만들기 위해서

user폴더 아래에 user_update_form.jsp라는 jsp파일을 만들고 user_insert_form.jsp의 소스코드를 복사해서 넣는다.

그리고 40~46 부분을 저런식으로 바꾸게 되면 수정 화면으로 넘어갈수있다.

*여기서 readonly 는 이 값을 수정 불가하게 만들겠다는 뜻이다.

실행을 하게 되면이제

이런식의 창이 만들어 지게 되는 것이다.

그런 다음 수정버튼을 눌러 리스트 창으로 움직이기 위해서 user 폴더 아래에

user_list_update.jsp 파일을 만든다음

user_list01.jsp파일의 코드를 복사해서 user_list_update.jsp파일안에 붙여 넣는다.

그런다음

사진과 같이 49~69까지의 부분을 다시 바꿔주게 되면

바꾼 정보를 통해 나오게 된다.

*단 이거는 jsp 파일을 그냥 순서대로 나열해서 만든것이고 페이지상에서의 바꾼 정보를 보여주는게 아니라

코드상에서 바꾼 정보를 보여주게 되는것이다.


다음으로는 탈퇴 페이지를 만드는데 탈퇴 페이지는 user_list_delete.jsp파일을 만든다.

그리고 나서 원래 있던 user_list01.jsp파일을 복사한 후에 user_list_delete.jsp 파일에 붙여 넣는다.

그런다음

54~66과 같이 바꿔주면 삭제 된거 같은 효과 처럼 보이게 할수있다

*탈퇴 버튼을 만들고 전에 잇던 링크들을 연결하고 수정해서 넣어야한다

수정버튼을 만들때와 마찬가지라고 생각하면됨

'학원에서 배운것들 > TEA - E' 카테고리의 다른 글

2017-04-10-E  (0) 2017.04.10
2017-04-07-E  (0) 2017.04.09
2017-04-06-E  (0) 2017.04.06
2017-04-04-E  (0) 2017.04.04
2017-04-03-E  (0) 2017.04.03
Comments