반응형 개발/기타15 [Jquery] jQuery sweetalert2 alert창 사용하기 1. 개요 jquery plugin sweetalert2를 사용하여 alert창을 좀더 깔끔하게 만들어 본다. https://sweetalert2.github.io/ SweetAlert2 A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes sweetalert2.github.io 2.기본디자인 아래와 같이 일반적인 alert창과 sweetalert2를 사용했을때의 기본문법을 보여준다. 3. install 및 cdn jquery 기준으로 아래와 같이 사용할수 있다. //필요한 파일을 참조 //원하는 경우 스타일시트를 별도로 포함 reactjs / vuejs 등에서는 아래와 .. 2023. 4. 16. [Jquery] jQuery Validation Ajax연동과 message custom 1. 개요 다음과 같은 예제 4개를 설명한다. 기본 사용법예제 Ajax연동을 통한 ID중복체크예제 별도로 정규식을 추가한 커스텀예제 rule 동적 추가 및 삭제예제 2. 제공속성 required: "This field is required.", remote: "Please fix this field.", email: "Please enter a valid email address.", url: "Please enter a valid URL.", date: "Please enter a valid date.", dateISO: "Please enter a valid date (ISO).", number: "Please enter a valid number.", digits: "Please enter only.. 2023. 4. 15. [jquery] summernote 썸머노트 사용예제 1. 개요 자바스크립트 jquery 라이브러리 웹에디터 썸머노트에 대한 사용법을 포스팅해보자. https://summernote.org/ Summernote - Super Simple WYSIWYG editor Super Simple WYSIWYG Editor on Bootstrap Summernote is a JavaScript library that helps you create WYSIWYG editors online. summernote.org 2. jQuery Summernote jQuery Summernote는 인기 있는 jQuery용 WYSIWYG(What You See Is What You Get) 텍스트 편집기 플러그인 서식 지정, 이미지 및 비디오 삽입, 표 만들기 등과 같은 기능을 사.. 2023. 4. 10. [jsTree] Spring + jstree 트리예제 1. 개요 스프링웹 환경에서 jquery tree plugin (jstree) 사용법을 포스팅한다. jquery.js (v3.6.0) / jstree.js (v3.3.2) / proton테마 를 사용했다. css다운로드는 jstree proton theme로 검색하면 많이 나온다. https://www.jstree.com/ jstree jsTree is jquery plugin, that provides interactive trees. It is absolutely free, open source and distributed under the MIT license. jsTree is easily extendable, themable and configurable, it supports HTML & JS.. 2023. 4. 7. [React] react v18 필수개념 컴포넌트+props 예제 ＋React 컴포넌트 재사용및 props사용 ＋ 리엑트를 처음 접하게 되면 html+jquery 조합과 다른점은 컴포넌트를 재활용할수있다. 보통html+jquery조합은 한페이지에 소스를 다작성하지만 react의경우는 모듈단위로 분리해서 개발한다. 아래샘플예제은 컴포넌트 재사용과 props개념을 잡는데 도움이 된다. ☞ 버전정보 리엑트 18.0버전은 22/03/29일 릴리즈 되었다. 지금은 18.2로 설치가 된다. ☞ 프로젝트생성 프로젝트 생성을 위해 아래 명령어를 실행한다. npx create-react-app example01 cd example01 npm start ☞ 프로젝트구조 불필요한 파일은 삭제하고 아래폴더 트리처럼 구축한다. ☞ index.js 18버전에서는 아래와 같은 형태로 변경되었다... 2023. 4. 4. [Google Chart] 구글차트 json연동 예제 (x,y축) ＋구글차트API를 json연동하여 예제＋ 아래링크를 참고한다. https://developers.google.com/chart/interactive/docs/gallery/linechart 선 차트 | Charts | Google Developers 이 페이지는 Cloud Translation API를 통해 번역되었습니다. Switch to English 의견 보내기 선 차트 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 개요 SVG 또는 VML을 developers.google.com 주의사항 최근릴리즈된 구글차트 api경우 이전에 개발된 소스로 하면 아래와 같은 오류가 발생된다. 아래 오류 발생시 current말고 버전숫자를 입력 Cannot read propertie.. 2023. 4. 4. 이전 1 2 3 다음 반응형
