란 개발일지

웹 개발 중 자바에서 화면으로 보낸 값을 자바스크립트에서 사용해야할 때가 있다. ** 모델, 뷰를 반환하는 방법은 다양한데 매번 까먹는다😩 > 2021.11.14 - [JAVA/SPRING] - [SPRING] Model, ModelMap, ModelAndView 차이점 [SPRING] Model, ModelMap, ModelAndView 차이점 Model @GetMapping("/") public String home(Model model) { model.addAttribute("name", data); return "index"; } Model은 인터페이스다. Controller에서 key: value 형태로 Model에 값을 저장하고 View에 이 데이터를 화면에 출력한다. Mo juran-devb..

갭알/JS & JQUERY 2022. 11. 22. 20:56

셀렉트 박스에 옵션 추가 // 주로 $.each 돌며 option 추가 $('#selectBoxId').append($('', { value: optionNo, text: optionName })); 순서(index)를 지정하여 selected 속성 추가 $("#selectBoxId option:eq({1})").attr("selected", "selected"); // 첫번째 옵션에 셀렉티드 속성 추가 text로 selected 속성 추가 $("#selectBoxId").val("{optionName}").attr("selected", "selected"); $("#selectBoxId").text("{optionName}").attr("selected", "selected"); value값으로 sel..

갭알/JS & JQUERY 2021. 11. 21. 22:46

기존 코드$("#btn").click(function(){ // 클릭 시 수행될 작업})동적으로 추가된 태그의 경우 기존에 이미 렌더링된 클릭 이벤트는 적용이 안된다. 그 이유는 아직 아이디가 btn 인 버튼이 생성되지 않아 인식하지 못하기 때문$("#btn").on({ click: function() { // 클릭 시 수행할 작업 }});내가 자주 쓰는 코드는 이거(이건 되는지 몰겠삼)* on() 이벤트를 실행할 때 실행하는 순간 바로 그 자리에서 찾아 연결해주는 메서드  수정된 코드$(document).on("click", "#btn", function(){ // 클릭 시 수행할 작업});위와 같이 수정하여 해결 할 수 있다.(클릭 뿐 아니라 다른 이벤트도 마찬가지..

갭알/JS & JQUERY 2021. 11. 8. 17:08

keydown() : 키를 눌렀을 때 이벤트 지정 $('#input').keydown(function (e) { if(e.keyCode == 13) { // enter key(13) 눌렀을 때 이벤트 } }) keyup() : 키를 놓았을 때 이벤트 지정 $('#input').keyup(function (e) { if(e.keyCode == 13) { // enter key(13) 놓았을 때 이벤트 } }) keypress() : 키를 눌렀을 때(keydown 이벤트 이후에) 발생, 영어와 숫자 눌렀을 때만 발생되며 기능키(func, shift 등) 적용 안됨 $('#input').keypress(function (e) { // event }) * 키를 눌렀을 때 keydown -> keypress ->..

갭알/JS & JQUERY 2021. 8. 26. 16:42

비밀번호 입력을 위해 태그를 썼을 때 로그에 남는 경고메시지들 해결하기 form 태그 Password is not contained in a form. -> input 태그를 form 태그로 감싸면 쉽게 해결 autocomplete Input elements should have autocomplete attributes. -> input 태그나 위에서 추가한 form 태그에 아래와 같이 속성을 추가하여 자동완성 기능 해제 autocomplete="off"

갭알/JS & JQUERY 2021. 8. 26. 16:27

자주 써도 헷갈리는 ajax 스크립트 한번에 정리 success & error & complete GET - 서버에서 데이터 조회 $.ajax({ url: url type: 'GET', async: true, // 기본값은 비동기, false일 경우 동기 요청으로 변경 dataType : 'json', // 서버로부터 수신할 데이터 타입 xml, script, html, text.. beforeSend: function (xhr) { // ajax 요청 전 실행되는 내용 }, success: function (result) { // 성공 시 수행할 내용 }, error: function (error) { // 실패 시 수행할 내용 }, complete: function(data) { // 성공 실패와 상..

갭알/JS & JQUERY 2021. 5. 18. 21:35

8자 이상 문자와 숫자 포함 /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/ 8자 이상 문자와 숫자, 특수 문자 포함 /^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,}$/ 8자 이상 대문자, 소문자 포함 /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$/ 8자 이상 대문자, 소문자, 특수문자 포함 /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&]{8,}/ 최소 6자 최대 12자 대문자, 소문자 숫자, 특수문자 포함 /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-..

갭알/JS & JQUERY 2021. 4. 29. 02:35

공백 체크 function checkBlank(value) { var blank_pattern = /[\s]/g; return blank_pattern.test(value); } 전화번호 입력 시 숫자 체크, 하이픈(-) 자동 추가 function autoHyphen(str) { str = str.replace(/[^0-9]/g, ''); var tmp = ''; if( str.length < 4) { return str; } else if(str.length < 7) { tmp += str.substr(0, 3); tmp += '-'; tmp += str.substr(3); return tmp; } else if(str.length < 11) { tmp += str.substr(0, 3); tmp +=..

갭알/JS & JQUERY 2021. 4. 23. 01:41