다연이네

구글차트 - 원형차트 -원형차트2 -가로막대형 차트 원형차트를 통해 db에서 데이터를 가져와 출력해보자 부서별 사원의 급여 합 출력하는 코딩 ex04_json.jsp ex04_json.jsp를 바로 실행시키면 다음과 같이 출력된다. 버튼을 클릭하면 3초 후에 연봉이 높은 사원 10명을 출력하는 꺾은선 그래프를 나타내도록 해보자. 3초동안은 ajax를 사용해 로딩 gif를 표시해보자. Ajax Chart ex05_json.jsp를 컴파일시키면 다음과 같다.

특정 알파벳을 검색하면 source에 있는 데이터 중 해당 알파벳을 포함하는 데이터들이 보여진다. Tags: 이 데이터를 DB에서 가져와보도록 하자. 사원의 이름을 검색하려고 할 때, 해당 알파벳을 가진 사원 정보가 뿌려지도록 해보자 Tags: ex02_03_autocomplete.jsp 참고로 ex02_03_autocomplete.jsp를 바로 실행시켜 파라미터를 넘겨주면 다음과 같이 출력된다.

회원가입할 때 아이디 중복 체크하는 JQuery + AJAX + JSON deptno : empno : ename : job : ex01_idcheck.jsp (위 코딩 실행시 empno가 존재하지 않으면 좌측, 존재하면 우측처럼 출력됨)

today:new Date() 날짜 객체가 문자열로 변환되어졌다. (무명)함수를 처리해서 30값으로 출력(변환)되는 것이 아니라 제거된다. 또한, 30이 제거됨과 동시에 age라는 속성명도 제거되었다. 위의 코딩을 해결하는 방법 무명함수를 문자열로 변환시킨 후 json으로 파싱(변환)하는 것이다. age: 문자열 함수 "function(){return 30;}" -> eval() 함수 사용하면 다시 함수로 변환할 수 있다. (기억) 언제한번 쓸 곳이 있을 것 데이터베이스에서 사원 정보를 가져와 json을 사용해 출력하기 ex04_emp_json.jsp ex04_emp_json.jsp처럼 하지 않고 외부 라이브러리를 사용하면 코딩이 더욱 간편하다. 라이브러리는 https://sourceforge.net/p..

https://www/json.org/ 즐겨찾기 JSON 개요 ㄱ. [J]ava[S]cript [O]bject [N]otiaion 자바스크립트 객체 표기법 ㄴ. 클라이언트와 서버 간에 데이터를 교환하는 용도 js 객체 -> 텍스트(문자열) 변환 -> 요청URL?파라미터 전달 JSON.stringify(person); ㄷ. XML보다 사람+기계한테 JSON이 더 간결(성능)/쉽다. ㄹ. 클라이언트 -> 서버 데이터 보내기 ㅁ. 클라이언트 -> 서버로 js객체를 JSON으로 변환해서 파라미터로 전달했고 서버에서는 JSON 텍스트(문자열) 파라미터를 js 객체로 변환시켜서 사용해야 된다면 JSON -> js Object로 변환하는 메소드 : JSON. parse() ㅂ. js Object를 JSON으로 변환해..

1. AJAX(Asynchronous Javascript And XML) (프로그램 언어가 아니라 기술) 비동기적인 자바스크립트 + XML 데이터 JSON ㄱ. 자바스크립트 언어를 사용해서 XML 데이터를 비동기적으로 서버-클라이언트 (간에 주고받는) 기술 xml 데이터를 자바스크립트 언어를 사용해 비동기적으로 처리하는 기술 ㄴ. 에이잭스 -- 에이작스 -- 아작스 ㄷ. 비동기적 의미 ? 웹 페이지를 다시 로드하지 않고 웹 페이지 업데이트 2. AJAX 장점 ㄱ. 페이지 전체 요청x -> 성능 향상 -수신하는 데이터의 양을 줄일 수 있다. ㄴ. 마치 스레드처럼 서버 처리하는 동안 기다리지 않고 또다른 비동기 처리를 요청할 수 있다. ㄷ. 서버 측 처리를 각각 PC에서 분산 처리 가능 3. AJAX 단점 ..

클라이언트 -업로드-> 서버 request객체로 파라미터 사용 불가 ㄷ. request.getInputStream() 개발자가 직접 구현 x(개념만 알기) 외부 라이브러리 사용 - cos.jar 서블릿 3.0이상 - 제공 + 회원가입 [][][] 사진 업로드할때 페이지는 이동하지 않고 이 상황에서 사진만 업로드해야 할 경우 Ajax를 사용해 파일을 업로드할 수 있어야 한다. 2) DB 테이블 생성 후 파일 업로드 ㄱ. web.xml 복붙 - web20210111_days11.xml ㄴ. days12 > ex01.jsp, write.jsp, list.jsp days12 패키지 추가 ㄷ. FILETEST 테이블 SEQ_FILETEST 시퀀스 생성 create table filetest( num number ..

파일 업로드 1. 게시판, 자료실, 쇼핑몰 등에서 문서 파일이나 이미지 파일 등을 서버에 올리는 작업(업로드) 서버->클라이언트(다운로드) 2. 실제 파일을 업로드하려면 ㄱ. 스트림 기반의 전송 방식인 method="post"로 설정해야 한다. (규칙) ㄴ. 인코딩 방식 설정 기본값: enctype="application/x-www-form-urlencoded" 설정되어 있는데, enctype="multipart/form-data"로 설정해야 한다. ***꼭 기억하자 ㄱ. ㄴ. 설정 꼭 철자 틀리지 않게 하자 3. request객체로 getParameter() -> null, null == request 객체로 파라미터를 사용할 수 없더라 첨부파일/ 이름 파라미터를 어떻게 처리하는가? ㄱ. 개발자가 직접..