반응형
체크박스를 전체 선택하고 삭제버튼 누를시 선택한 리스트 삭제하는 코드
html 부분
//전체선택버튼
<label class="k-checkbox">
<input type="checkbox" id="checkbox_all" onclick="chk_all()">
<span></span>
</label>
//리스트쪽 체크박스
<label class="k-checkbox">
<input type="checkbox" class="list_check">
<span></span>
</label>
javascript 부분
//체크박스 전체 선택
function chk_all(){
if($("#checkbox_all").is(":checked")){
$('.list_check').prop('checked', true);
}else{
$('.list_check').prop('checked', false);
}
}
//선택라인 모두 삭제
function chk_remove(){
$.each ($('.list_check'), function (index, value) {
let obj = $(value);
if(obj.is(":checked")){
let tr = obj.parent().parent().parent(); //요소에 따라 변경필요
tr.remove();
}
});
}
버튼을 눌렀을 때 같은 class 명을 가지고 있는 요소들을 모두 check 하거나 check 를 해제하는 코드이다.
chk_remove의 경우 해당 tr 라인을 삭제해버리는 코드이니
table 속에 tr 부분에 삭제버튼을 만들게 되면 사용할만하다.
table 속 요소에 따라 obj.parent() 부분은 변경이 필요하다
반응형
'자바스크립트(jquery)' 카테고리의 다른 글
javascript undefined, null 체크 (0) | 2024.03.23 |
---|---|
jquery 다량의 배열 post (0) | 2024.03.22 |
javascript에서 formData append 확인법 (0) | 2024.03.22 |
javascript 로딩 프로그래스바 (0) | 2024.03.22 |
javascript 백슬래시 처리 (0) | 2024.03.22 |