Language/JavaScript3 자바스크립트(JavaScript) 셀렉트 박스(select box) 선택된 옵션(selected option)의 값(value), 텍스트(text) 가져오기 jQuery를 이용하면 아래 코드를 활용해서 셀렉트 박스의 옵션을 제어할 수 있습니다. $('#selectbox > option'); // id를 기준으로, selectbox의 모든 옵션 조회 $('#selectbox > option:checked'); // id를 기준으로, selectbox에서 현재 선택된 옵션 조회 $('select[name="selectbox"] > option:checked').val(); // name을 기준으로, selectbox에서 현재 선택된 옵션의 값(value) 조회 $('select[name="selectbox"] > option:checked').text(); // name을 기준으로, selectbox에서 현재 선택된 옵션의 텍스트(text) 조회 아래 코드는 순.. 2023. 5. 30. 자바스크립트(JavaScript) 체크박스(checkbox), 라디오 버튼(radio) 체크 여부(checked) 및 체크된 값(checked value) 가져오기 jQuery를 이용하면 다음과 같이 체크박스 또는 라디오 버튼의 체크 여부와 체크된 값을 알아낼 수 있습니다. $('input[name="checkbox"]').is(':checked'); // 체크박스 체크 여부(checked) $('input[name="radio"]:checked').val(); // 라디오 버튼 체크된 값(checked value) "나는 순수 자바스크립트가 좋아!"라고 하신다면 다음과 같이 처리해 주시면 됩니다. document.querySelector('#checkbox').checked; // 체크박스 체크 여부(checked) document.querySelector('input[name="radio"]:checked').value; // 라디오 버튼 체크된 값(checke.. 2023. 5. 28. 자바스크립트(JavaScript) - 폼 데이터(FormData)에 객체 배열(파일 포함) 여러 개를 담아 컨트롤러로 전송하는 방법 다음과 같이 파일이 포함된 객체(JSON)를 자바스크립트 폼 데이터에 담아 컨트롤러로 전송해야 했었습니다. 여러 가지 방법으로 시도해 보았지만 컨트롤러에서는 파라미터를 수집하지 못하는 상황이었고, 며칠을 헤매다 커뮤니티를 통해 방법을 찾게 되었습니다. 앞의 BoardDTO 객체를 리스트로 전달받으려면 아래와 같이 임시 클래스를 하나 생성한 후 컨트롤러 메서드의 파라미터로 선언해 주면 됩니다. 프론트 단에서 JS 로직은 아래와 같은 형태로 처리되는데요. 우선, 비어있는 FormData와 각 DTO를 담을 배열(boards), 그리고 각 DTO의 멤버를 저장할 리터럴 객체(data)를 선언합니다. for 문의 inputs는 HTML form 태그의 모든 input 엘리먼트를 의미하고, name, value는.. 2023. 5. 28. 이전 1 다음
