Fix: VIP 카테고리 모두보기 토글 - display 속성으로 즉시 반영
- PHP에서 비활성 카테고리도 항상 렌더링하도록 continue 제거 - input과 label 모두에 inactive-cat 클래스 추가 - JavaScript에서 .inactive-cat 요소의 display를 토글하여 즉시 반영
This commit is contained in:
@ -37,14 +37,12 @@ $table = "{$fg['vip_list_table']} AS a LEFT JOIN {$fg['vip_category_table']} AS
|
||||
$group_name = getVipCatName();
|
||||
$show_all = isset($_REQUEST['show_all_cat']) ? true : false;
|
||||
foreach ($group_name as $row) { // VIP구분 가지고 와서 뿌려주기
|
||||
// 비활성 카테고리 숨김
|
||||
if ($row['gr_used'] == 0 && !$show_all) continue;
|
||||
$inactive_class = ($row['gr_used'] == 0) ? ' inactive-cat' : '';
|
||||
$display_style = ($row['gr_used'] == 0 && !$show_all) ? 'display: none;' : '';
|
||||
$display_style = ($row['gr_used'] == 0) ? 'display: none;' : '';
|
||||
?>
|
||||
<input type="radio" name="search_group" id="search_group_<?=$row['gr_id']?>" class="btn-check" value="<?=$row['gr_id']?>" <?php if ($search_group === $row['gr_id']) echo "checked" ?>>
|
||||
<input type="radio" name="search_group" id="search_group_<?=$row['gr_id']?>" class="btn-check<?=$inactive_class?>" value="<?=$row['gr_id']?>" <?php if ($search_group === $row['gr_id']) echo "checked" ?> style="<?=$display_style?>">
|
||||
<label class="btn btn-outline-primary category-label<?=$inactive_class?>" for="search_group_<?=$row['gr_id']?>" style="<?=($row['gr_used'] == 0) ? 'opacity: 0.5;' : ''?><?=$display_style?>"><?=$row['gr_name']?></label>
|
||||
<?php } ?>
|
||||
<?php } // endforeach ?>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="toggleShowAllCat()" data-show-all="<?=($show_all) ? 'true' : 'false'?>">
|
||||
<?=($show_all) ? '활성만 보기' : '모두보기'?>
|
||||
</button>
|
||||
@ -376,12 +374,10 @@ $table = "{$fg['vip_list_table']} AS a LEFT JOIN {$fg['vip_category_table']} AS
|
||||
const btn = event.target;
|
||||
const showAll = !btn.getAttribute('data-show-all') || btn.getAttribute('data-show-all') === 'false';
|
||||
|
||||
// UI 즉시 업데이트
|
||||
const categoryLabels = document.querySelectorAll('.category-label');
|
||||
categoryLabels.forEach(label => {
|
||||
if (label.classList.contains('inactive-cat')) {
|
||||
label.style.display = showAll ? 'inline-block' : 'none';
|
||||
}
|
||||
// 비활성 카테고리 input과 label 토글
|
||||
const inactiveElements = document.querySelectorAll('.inactive-cat');
|
||||
inactiveElements.forEach(elem => {
|
||||
elem.style.display = showAll ? 'inline-block' : 'none';
|
||||
});
|
||||
|
||||
// 버튼 텍스트 업데이트
|
||||
|
||||
Reference in New Issue
Block a user