개발노트/TroubleShooting

[JavaScript] 게시판 첨부파일 삭제 시 atchFileId가 계속 남아있는 문제

dev-mylee 2025. 1. 21. 11:16

## 문제 상황

게시글 수정 시 기존 첨부파일을 삭제해도 atchFileId 값이 계속 남아있어서,

파일이 없는데도 DB에 atchFileId가 들어가는 현상 발생

 

## 원인 분석

1. 파일 정보가 저장되는 방식:

// hidden input에 파일 ID 저장
<input type="hidden" id="atchFileId" name="atchFileId">

// 각 파일행의 숨겨진 div에 파일 상세 정보 저장
<div class="file-info" style="display:none;"></div>

 

 

2. 삭제 버튼 클릭 시 파일명만 초기화하고 atchFileId는 그대로 남아있었음

$(".btn_delete").click(function() {
    var row = $(this).closest("tr");
    row.find('input[name="fileName"]').val("");  // 파일명만 초기화
    row.find('.file-info').html("");  // 파일 정보는 초기화
    // but atchFileId는 초기화 안됨
});

 

 

## 해결 방법

삭제 버튼 클릭 시 남은 파일이 있는지 체크 후, 없으면 atchFileId도 초기화하도록 수정:

$(".btn_delete").click(function() {
    var row = $(this).closest("tr");
    row.find('input[name="fileName"]').val("");
    row.find('.file-info').html("");
    
    // 남은 파일 체크
    var hasRemainingFiles = false;
    $("#fileTableBody tr").each(function() {
        if($(this).find('.file-info').html()) {
            hasRemainingFiles = true;
            return false;
        }
    });
    
    // 파일 없으면 atchFileId도 초기화
    if(!hasRemainingFiles) {
        $("#atchFileId").val('');
    }
});

 

 

 

검증

  1. 파일이 하나도 없을 때: atchFileId = ''
  2. 파일 일부 삭제 시: 기존 atchFileId 유지
  3. 모든 파일 삭제 시: atchFileId = ''