4 - 9 점포 등록 의 전단 디자인
6982 단어 SSM 실전
UI 프레임 워 크
SUI Mobile 은 핸드폰 H5 애플 리 케 이 션 을 편리 하고 신속하게 구축 할 수 있 으 며 자체 적응 (웹 페이지 너비 에 자동 으로 적응 하고 해당 하 는 디자인) 웹 UI 프레임 워 크 입 니 다.
http://m.sui.taobao.org/
예제 에서 폼 선택 - 우 클릭 - 웹 소스 표시 - 복사


src / main / webapp 에서 index. html 만 들 기
전단 원본 을 복사 합 니 다.
그러나 css, js 코드 는 도입 되 지 않 았 다.


"사용 시작" 클릭 http://m.sui.taobao.org/getting-started/

페이지 템 플 릿 의 css 주 소 를 복사 하여 프로젝트 의 css 를 교체 합 니 다.


JS 동 리
수정 후 Tomcat 시작, 입력http://localhost:8080/o2oDemo/index.html
HTML 수정
우 리 는 아래 의 양식 이 필요 하 다.
주의:
1. 원래 코드 를 바탕 으로 수정 합 니 다. 예 를 들 어 드 롭 다운 상 자 는 다음 과 같은 코드 입 니 다.
Gender
으로
아 이 디 를 한 번 더 추가 하려 면 JS 를 조작 할 수 있 고 분류 정 보 는 데이터베이스 에서 읽 을 수 있 습 니 다.
2. 업로드 공간, input type 은 file
페이지 보기

이곳 에서 우 리 는 사용자 가 직접 방문 하 는 것 을 원 하지 않 는 다.http://localhost:8080/o2oDemo/index.html 페이지 를 볼 수 있 기 때문에 WEB - INF 에 넣 을 수 있 습 니 다.
따라서 다음 과 같이 수정 합 니 다.

shophooperation. html
이렇게 URL 을 통 해 이 페이지 에 직접 접근 할 수 없습니다.

따라서 이 페이지 의 경 로 를 설정 해 야 합 니 다.
ShopAdminController 파일 만 들 기


위의 그림 에서
1. HTML 이름
2. 이 URL 이 있 는 폴 더 주소 입 니 다. 접두사 가 없 는 것 은 spring - web. xml 에 접두사 가 설정 되 어 있 기 때 문 입 니 다.

설정 후 shopmin / shop operation 의 경로 에 따라 접근 할 수 있 습 니 다.

제출 버튼 에 id 를 추가 하면 JS 작업 에 편리 합 니 다.

소결:
WEB - INF 에 있 는 파일 에 접근 하려 면 백 스테이지 리 트 윗 을 통 해서 만 받 을 수 있 습 니 다.