본문 바로가기

WEB

 (32)
modal close 모달창 닫는 이벤트 만들기 closeBtn.addEventListener("click", e => { detail_marker_modal.style.display = "none" });​ X ..내용채워넣기 모달창을 만들어준다. 우선 모달창은 style display:hidden으로 설정해준다. 그리고 이벤트가 생겼을 때에 style속성을 없애주거나 display:bolck 처리하면 모달이 생겨난다. 모달창 닫는 공간을 div로 만들어 준후 const closeBtn = modal.querySelector(".close-area") querySelector를 이용해서 닫기 버튼을 const변수에 지정해준후 closeBtn.addEventListener("click", e => { modal.style.display = "none"..
[mybatis/mariaDB] auto increment값 가져오기 데이터 베이스에 insert를 하다보면 PK를 시퀀스처럼 자동증가하는 값으로 설정하는 경우가 있을 것이다. 그럴때 PK를 가져오고 싶은데 insert할때 값으로 넣지 않는 경우 가져올 수가 없다. 그럴때 mybatis기능을 사용하면 된다. sql문에 다음과 같은 속성을 넣어준다 . useGeneratedKeys="true" keyProperty="seq" INSERT INTO sample(test) VALUES (#{test}); test = "me"; Map map = new HashMap(); map.put("test", test); int result = sampleService.Sample(map); String seq = map.get("seq").toString(); 이렇게 하면 String ..
[javascript/ajax] ajax의 구성 및 기능 ajax는 비동기 JavaScript and XML의 약어라는데 간단히 말하자면 페이지가 빨리 로딩되는 함수?기능?이다. ajax는 아래처럼 생겼다. $.ajax({ method: "GET", dataType: "json", data: { "test": test, "test2": test2 }, url: "/sample", success: function(data) { },error:function(error){ } }); 속성이 여러개 있지만 이정도만 사용하면 왠만한건 다 구현할 수 있었다. method get타입으로 보낼건지, post방식으로 보낼건지 정하는 옵션이다. get은 보안이 좀 약하고 post는 보안이 좀 가미된 느낌 ajax에서 보낸 데이터를 spring에서 controller단에서 받을..
[javascript] kakaomap api 도형 event listener 배열 객체 등록 꿀팁 카카오맵에 도형을 나타내고자 할때 전역배열로 도형을 넣는다면 삭제(초기화)도 쉽게 할 수 있다. 하지만 전역배열로 도형을 넣을 때의 단점도 있는데 도형을 클릭했을때 실행되는 이벤트 리스너에 배열을 객체로 등록하면 도형의 메서드를 사용하지 못한다는 점이다 ( 예를 들면 getBounds나 getPosition 같은 메서드들 ) 해결 방법은 이벤트리스너를 새로운 함수 안에 넣어 배열을 매개변수로 해서 매개변수의 메서드를 사용하게 만드는 것이다. 말이 좀 이해가 안되는 것 같아 코드를 첨부한다. 아래처럼 배열을 객체로 등록하지 않고 kakao.maps.event.addListener(circle[i], 'click', function(mouseEvent) { ... } 이런식으로 함수로 한번 감싸서 사용해야한..
[spring] 프로젝트 이름 안보이게 하기 https://docs.spring.io/spring-framework/docs/ Index of /spring-framework/docs docs.spring.io context 보기 싫으면 프로젝트 우클릭 ->propertise-> Web Project Settings context root : / 서버 자세히 보기 누른뒤 현재 실행한 서버 삭제해야 context 바뀐 것 제대로 표시됨.
DI (dependency injection) 의존성 주입 DI, 의존성 주입은 필요한 객체를 직접 생성하는 것이 아닌 외부로 부터 필요한 객체를 받아서 사용하는 것이다. 이를 통해 객체간의 결합도를 줄이고 코드의 재활용성을 높여준다. https://velog.io/@wlsdud2194/what-is-di [DI] Dependency Injection이란 무엇일까? Dependency Injection, 의존성 주입이 무엇이고 어떤 이점이 있는지 예시를 통해 정리한 글입니다. velog.io
게시판에 파일 저장하기 게시판을 만들 때 파일을 첨부해야 한다. jsp에서 multipart/from-data형식으로 데이터를 보냈을 때 servlet에서 받아올 때 역시 multipart형식으로 받아와야 한다. 그때 사용하는 annotation이다. @MultipartConfig( location = 디스크 위치, 절대 경로.. 절대 경로는 서비스를 실행하는 리눅스와 윈도우즈에 차이가 있으므로 차라리 설정을 안 하고 자바가 지정된 임시 디렉터리를 사용하도록 하자, fileSizeThreshold = 바이트 단위, 이 값을 넘어갈 경우 디스크를 쓰자, maxFileSize = 첨부파일 하나의 최대 사이즈, maxRequestSize = 모든 파일의 총 사이즈 ) Part filepart = request.getPart("fil..
데이터 입력을 구현하기 데이터 입력문 을 INSERT INTO notice ( title, writer_id, content, files ) VALUES ( :v0, :v1, :v2, :v3 ); JAVA ECLIPSE로 작성하기 main문 안에 넣으면 된다. String title = "test2"; String writer_id = "newlec"; String content = "hahaha"; String files = ""; String url = "jdbc:oracle:thin:@localhost:1521/xepdb1"; String sql = "INSERT INTO notice (" + " title," + " writer_id," + " content," + " files" + ") VALUES (?,?,?,?)..

티스토리툴바