반응형 jQuery8 [SpringBoot] WebSocket 채팅방 구현(3) - html , js 이전글https://greed-yb.tistory.com/281 [SpringBoot] WebSocket 채팅방 구현(2) - WebSocketConfigJava 로 구현WebSocketConfigimport org.springframework.context.annotation.Configuration;import org.springframework.web.socket.config.annotation.EnableWebSocket;import org.springframework.web.socket.config.annotation.WebSocketConfigurer;import org.springfgreed-yb.tistory.com html 메신저 .. 2024. 8. 18. [SpringBoot] WebSocket 채팅방 구현(1) - 구현 화면 사용 중Bootstrap v4.6.0DataTables org.springframework.boot spring-boot-starter-websocket CSS 및 Class 명까지 그대로 올리니 나중에 구현할 때 감안할 것 직원 목록 및 채팅방 목록을 DataTables 로 구현하였으니DataTables 을 사용하지 않는 경우 DataTables 을 구현 시 row 에 추가하는 태그들을 참고하길 바란다 구현 화면 예시 메시지가 오면 해당 모양이 빨간색으로 변경되고 메시지 수가 올라간다메시지 이모티콘 클릭 시 오른쪽에서 메신저창이 나오도록 구현하였다 더블클릭 시 대화창으로 변경되며, 이전 대화방이 있다면 대화내용을 불러온다 메시지가 오면 실시간으로사내 메신저 아래 .. 2024. 8. 17. [JavaScript] jQuery 를 이용한 Enter key 적용하기 입력필드에서 데이터를 전송하거나 동작할 때 마우스로 버튼을 클릭하는게 아닌키보드의 Enter 키를 눌렀을 때 동작 할 수 있게 Enter 를 인지하게 해주는 코드다 $(document).ready(function() { $("#text").on("keyup", function (event){ if (event.key === 'Enter' || event.keyCode === 13) { alert("Enter Key를 눌렀습니다."); } })}); 2024. 8. 2. [SpringBoot] DataTable 이용하여 추가,수정,삭제 구현하기 https://greed-yb.tistory.com/252 [SpringBoot] DataTable(JavaScript) - 적용하기이전글 이어서https://greed-yb.tistory.com/251 [SpringBoot] Thymeleaf - layout 적용하기https://greed-yb.tistory.com/218#google_vignette [Spring] Bootstrap SB Admin 2 설치하기 https://greed-yb.tistory.com/209 [SpringBoot+IntelliJ+Oracle+Thymelgreed-yb.tistory.comDataTable 적용은 이전글을 참고하길 바란다 html 권한 .. 2024. 7. 26. [SpringBoot] FullCalendar을 이용한 캘린더 구현하기 cdn voimport lombok.Getter;import lombok.Setter;@Getter@Setterpublic class CalendarVo { private Long calendarNo; private String title; private String start1; private String end; private boolean allDay;} controllerimport com.example.practice.service.calendar.CalendarService;import com.example.practice.vo.calendar.CalendarVo;import org.springframework.beans.fa.. 2024. 7. 23. [SpringBoot] Autocomplete을 이용한 자동완성기능 구현하기 Autocomplete 는 jQuery 의 함수 중 하나로사용자가 입력한 데이터를 실시간 감지하여 연관되는 데이터를 자동완성시켜 주는 기능을 한다 jQuery html 전체 경영 영업 개발 js// 결재자 변수let tData;// 결재자 부서 선택 변수let selectDepartValue = "";// label 과 value로 설정할때 사용const tData2 = [{label : "대표", value : "1"},{label : "부장", value : "2"},{label : "과장", value : "3"},{label : "대.. 2024. 7. 22. 이전 1 2 다음 반응형
