글목록에서 카테고리(분류) AJAX + 레이어 팝업 방식일괄 변경하기
테마 /skin/board/ 사용중인 스킨명 /list.skin.php 아래 내용 추가
① 버튼 추가 (선택복사/이동 버튼 근처)
<li><button type="submit" name="btn_submit" value="선택이동" onclick="document.pressed=this.value"> 선택이동</button></li>
<?php if ($is_category) { ?><li><button type="button" id="btn_ajax_cate" class="btn_b01 btn">선택분류변경</button></li><?php } ?>
② 레이어 팝업 HTML 및 CSS 추가
</script>
</div>
<?php if ($is_category) {
$ca_list = explode('|', $board['bo_category_list']);
?>
<div id="cate_layer_pop" style="display:none; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:300px; background:#fff; border:1px solid #ccc; box-shadow:0 0 10px rgba(0,0,0,0.2); z-index:9999; padding:20px;">
<h3 style="margin-top:0; padding-bottom:10px; border-bottom:1px solid #ddd; font-size:16px; font-weight:bold;">분류 일괄 변경</h3>
<form id="fajax_cate">
<div style="margin:15px 0; max-height:200px; overflow-y:auto; line-height:24px;">
<label><input type="radio" name="change_ca_name" value="" checked> [분류없음]</label><br>
<?php foreach($ca_list as $ca) { if(!$ca) continue; ?>
<label><input type="radio" name="change_ca_name" value="<?php echo urlencode($ca); ?>"> <?php echo $ca; ?></label><br>
<?php } ?>
</div>
<div style="text-align:right;">
<button type="button" id="btn_cate_submit" style="padding:5px 10px; background:#333; color:#fff; border:0; cursor:pointer;">변경하기</button>
<button type="button" id="btn_cate_close" style="padding:5px 10px; background:#eee; border:1px solid #ccc; cursor:pointer;">취소</button>
</div>
</form>
</div>
<?php } ?>
<?php if($is_checkbox) { ?>
<noscript>
------------------- ③번 '자바스크립트(AJAX) ----------------------------------
// 게시판 리스트 관리자 옵션
jQuery(function($){
$(".btn_more_opt.is_list_btn").on("click", function(e) {
e.stopPropagation();
$(".more_opt.is_list_btn").toggle();
});
$(document).on("click", function (e) {
if(!$(e.target).closest('.is_list_btn').length) {
$(".more_opt.is_list_btn").hide();
}
});
// 여기서부터 ajax 코드를 삽입합니다 ------------------------------------------
// 분류변경 버튼 클릭 시 레이어 띄우기
$("#btn_ajax_cate").click(function() {
var chk_count = $("input[name='chk_wr_id[]']:checked").length;
if (chk_count < 1) {
alert("분류를 변경할 게시물을 하나 이상 선택하세요.");
return false;
}
$("#cate_layer_pop").show();
$(".more_opt.is_list_btn").hide(); // 열려있는 옵션 메뉴 닫기
});
// 레이어 닫기 (취소 버튼)
$("#btn_cate_close").click(function() {
$("#cate_layer_pop").hide();
});
// AJAX 전송 및 처리 (변경하기 버튼)
$("#btn_cate_submit").click(function() {
var wr_ids = [];
$("input[name='chk_wr_id[]']:checked").each(function() {
wr_ids.push($(this).val());
});
var target_cate = $("input[name='change_ca_name']:checked").val();
if(!confirm("선택한 " + wr_ids.length + "개 게시물의 분류를 변경하시겠습니까?")) {
return false;
}
$.ajax({
type: "POST",
url: "<?php echo $board_skin_url; ?>/ajax.category_update.php",
data: {
bo_table: "<?php echo $bo_table; ?>",
wr_id_list: wr_ids.join(','),
ca_name: target_cate
},
dataType: "json",
success: function(data) {
if(data.error) {
alert(data.error);
} else {
alert(data.msg);
location.reload(); // 성공 시 화면 새로고침
}
},
error: function(xhr, status, error) {
alert("오류가 발생했습니다. 다시 시도해 주세요.");
}
});
});
// 여기까지 삽입 끝 --------------------------------------------------------
});
</script>
<?php } ?>
이렇게 수정하시고 첨부한 파일도 사용 중인 테마 /skin/board/ 사용중인 스킨명 경로에 두시면 됩니다.
AI 도움으로 작성된 내용입니다.
저는 잘 적용이 되네요
① 버튼 추가 (선택복사/이동 버튼 근처)
<li><button type="submit" name="btn_submit" value="선택이동" onclick="document.pressed=this.value"> 선택이동</button></li>
<?php if ($is_category) { ?><li><button type="button" id="btn_ajax_cate" class="btn_b01 btn">선택분류변경</button></li><?php } ?>
② 레이어 팝업 HTML 및 CSS 추가
</script>
</div>
<?php if ($is_category) {
$ca_list = explode('|', $board['bo_category_list']);
?>
<div id="cate_layer_pop" style="display:none; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:300px; background:#fff; border:1px solid #ccc; box-shadow:0 0 10px rgba(0,0,0,0.2); z-index:9999; padding:20px;">
<h3 style="margin-top:0; padding-bottom:10px; border-bottom:1px solid #ddd; font-size:16px; font-weight:bold;">분류 일괄 변경</h3>
<form id="fajax_cate">
<div style="margin:15px 0; max-height:200px; overflow-y:auto; line-height:24px;">
<label><input type="radio" name="change_ca_name" value="" checked> [분류없음]</label><br>
<?php foreach($ca_list as $ca) { if(!$ca) continue; ?>
<label><input type="radio" name="change_ca_name" value="<?php echo urlencode($ca); ?>"> <?php echo $ca; ?></label><br>
<?php } ?>
</div>
<div style="text-align:right;">
<button type="button" id="btn_cate_submit" style="padding:5px 10px; background:#333; color:#fff; border:0; cursor:pointer;">변경하기</button>
<button type="button" id="btn_cate_close" style="padding:5px 10px; background:#eee; border:1px solid #ccc; cursor:pointer;">취소</button>
</div>
</form>
</div>
<?php } ?>
<?php if($is_checkbox) { ?>
<noscript>
------------------- ③번 '자바스크립트(AJAX) ----------------------------------
// 게시판 리스트 관리자 옵션
jQuery(function($){
$(".btn_more_opt.is_list_btn").on("click", function(e) {
e.stopPropagation();
$(".more_opt.is_list_btn").toggle();
});
$(document).on("click", function (e) {
if(!$(e.target).closest('.is_list_btn').length) {
$(".more_opt.is_list_btn").hide();
}
});
// 여기서부터 ajax 코드를 삽입합니다 ------------------------------------------
// 분류변경 버튼 클릭 시 레이어 띄우기
$("#btn_ajax_cate").click(function() {
var chk_count = $("input[name='chk_wr_id[]']:checked").length;
if (chk_count < 1) {
alert("분류를 변경할 게시물을 하나 이상 선택하세요.");
return false;
}
$("#cate_layer_pop").show();
$(".more_opt.is_list_btn").hide(); // 열려있는 옵션 메뉴 닫기
});
// 레이어 닫기 (취소 버튼)
$("#btn_cate_close").click(function() {
$("#cate_layer_pop").hide();
});
// AJAX 전송 및 처리 (변경하기 버튼)
$("#btn_cate_submit").click(function() {
var wr_ids = [];
$("input[name='chk_wr_id[]']:checked").each(function() {
wr_ids.push($(this).val());
});
var target_cate = $("input[name='change_ca_name']:checked").val();
if(!confirm("선택한 " + wr_ids.length + "개 게시물의 분류를 변경하시겠습니까?")) {
return false;
}
$.ajax({
type: "POST",
url: "<?php echo $board_skin_url; ?>/ajax.category_update.php",
data: {
bo_table: "<?php echo $bo_table; ?>",
wr_id_list: wr_ids.join(','),
ca_name: target_cate
},
dataType: "json",
success: function(data) {
if(data.error) {
alert(data.error);
} else {
alert(data.msg);
location.reload(); // 성공 시 화면 새로고침
}
},
error: function(xhr, status, error) {
alert("오류가 발생했습니다. 다시 시도해 주세요.");
}
});
});
// 여기까지 삽입 끝 --------------------------------------------------------
});
</script>
<?php } ?>
이렇게 수정하시고 첨부한 파일도 사용 중인 테마 /skin/board/ 사용중인 스킨명 경로에 두시면 됩니다.
AI 도움으로 작성된 내용입니다.
저는 잘 적용이 되네요
첨부파일
총 1명이 반응했습니다
|
댓글을 작성하시려면 로그인이 필요합니다.
댓글 2개