DataTables 사용법 및 예제 ✔️ DataTables는 을 그리드 형식으로 사용하고 표시 건수 제어, 페이징, 정렬, 검색, 필터, 스크롤 기능 등을 제공하는 라이브러리다. DataTables는 서버에서 데이터를 JSON으로 받아 표시할 수 있으며, 아래와 같은 기능이 제공되어 추가할 수 있다. - 표시 건수 제어 기능 - 검색 기능 - 정렬 기능 - 필터 기능 - 스크롤 기능 DataTables - JSON 데이터 테이블에 출력하기 DataTables를 사용하기 위해서는 DataTables의 JS파일, CSS파일, jQuery를 필요로 합니다. [ {"id" : "JSON01", "name" : "제이슨01", "location" : "서울"}, {"id" : "JSON02", "name" : ..
JavaScript - change 이벤트 처리하는 방법 자바스크립트의 onchange() 이벤트는 셀렉트 박스의 값이 변경될 때 자주 사용합니다. selectbox의 옵션을 클릭할 때! 즉, 값이 변경될 때 onchange() 이벤트에서 사용자가 지정한 함수를 호출하여 사용할 수 있습니다. 문법 1 우선 HTML 태그에 직접 onchange를 명시하여 호출하는 방법을 알아보도록 하겠습니다. select 태그에 onchage를 아래와 같이 붙이게 되면 option값이 선택될 때 해당 함수 f_changeFunc(this) 가 호출됩니다. 직무를 선택하세요. 개발 인사 마케팅 직접입력 f_changeFunc 함수를 호출할 때 this로 자기자신을 파라미터로 전달하였기 때문에 해당 스크립트 함수에서는 $(변..
JQuery를 이용해 select의 option 선택/변경하는 방법 우선 속성 값을 변경하는 방법으로 prop 함수를 활용하여 앨리먼트를 컨트롤 하겠습니다. .prop() .prop()는 지정한 선택자를 가진 첫번째 요소의 속성값을 가져오거나 속성값을 추가합니다. 주의할 점은 HTML 입장에서의 속성(attribute)이 아닌 JavaScript 입장에서의 속성(property)이라는 것입니다. 방법1. onchange 이벤트 함수 내 사용해야 하는 경우 $("#select_id").on("change", function(){ // value 값으로 선택 $(this).val("1").prop("selected", true); // option 순서값으로 선택 $(this).find("option:eq(..