[국민취업지원제도 일경험프로그램 25일차] 게시판 이미지 첨부 버튼, 이미지 픽셀 유효성 검사

25일 차 특이사항

1. SQLD 복습하면서 하루 시작.

 

2. 오라클DB에 이미지 첨부가 안 되고 있음. 뭐가 문제일까? 정확히는 모르겠지만 mapper에 문제가 있다. 지금 parameter를 받아오지 못해서 부적합한 열 유형 1111이 계속 뜨고 있다. 나는 이 문제를 해결할 수 있을까? 모르겠다. 그냥 따라 해야겠다. 일단 배우자. 

 

3. 오류 내용 

Request processing failed; nested exception is org.mybatis.spring.MyBatisSystemException: nested exception is org.apache.ibatis.type.TypeException: Could not set parameters for mapping: ParameterMapping{property='realName', mode=IN, javaType=class java.lang.Object, jdbcType=null, numericScale=null, resultMapId='null', jdbcTypeName='null', expression='null'}. Cause: org.apache.ibatis.type.TypeException: Error setting null for parameter #1 with JdbcType OTHER . Try setting a different JdbcType for this parameter or a different jdbcTypeForNull configuration property. Cause: java.sql.SQLException: 부적합한 열 유형: 1111

 

4. 이 코드가 계속 오류난다. mapper 문제가 확실하다. 

int fileInsert = service.fileinsert(fileMap);	// 이게 지금 문제야

 

5. 픽셀 체크 500x500 이하 스크립트로 구현 

 

게시판 이미지 첨부 

1. 파일추가 버튼 만들기 

<input type = "button" name="" id=""> 

2. 파일마다 name을 다르게 주는 것이 좋다. name과 id 한 칸 띄워준다. 

3. .html() html 주면 덮어쓰기 하면서 적용된다. 

4. .append() 적용되면서 태그가 추가된다.  

5. 동적으로 생성된 태그는 javascript 쓰는 것이 좋다. 잡기가 힘들다. 비효율적이다. 

6. focus 를 한 곳만 하고 싶으면 this 사용 

7. .parent() 부모 선택 .children() 자식 선택 

8. 혼자 코드 만드려니까 잘 모르겠다. 결국 코드를 복사해서 가져왔다. 언제쯤 나는 혼자 코드를 만들 수 있을까? 

 

[script] 파일첨부하기 버튼 누르면 새로운 이미지 첨부 태그 추가

1) jsp 

<c:if test="${empty detail }">
    <div id = "fileDv">
        <input type = "button" name = "fileAdd" id = "fileAdd" value = "파일추가"><br>
    </div>
    <input type = "button" name = "regBtn" id = "regBtn" value = "등록">
</c:if>

 

2) script 

<script>
	$(function(){
		
		$("#regBtn").click(function(){
			$("#frm").attr("action","insert").attr("method","post").submit();
		})
		
		$("#uptBtn").click(function(){
			$("#frm").attr("action","update").attr("method","post").submit();
		})
		
		var tmp=0;
		$("#fileAdd").click(function(){
			var file = "<input type=file name=file"+tmp+" id=file"+tmp+" onchange=checkFile(this)><input type=button id=delBtn"+tmp+" value=삭제 onclick=fncDelete(this)><br>";
			$("#fileDv").append(file);

			tmp++;
		})
		
		
	})
	// 삭제 버튼 클릭시 이전, 후 태그 삭제 
	function fncDelete(delBtn){
		$(delBtn).prev().remove();
		$(delBtn).next().remove();
		$(delBtn).remove();
	}
	
	// 이미지 픽셀(500*500) 체크 
	function checkFile(el) {
		
	    var file = el.files;
	    var reader = new FileReader();
	
	    // 파일 읽기가 완료되면 실행되는 이벤트 핸들러
	    reader.onload = function (e) {
	        var img = new Image();
	        img.src = e.target.result;
	
	        img.onload = function () {
	            // 이미지의 가로와 세로 차원을 검사
	            var maxWidth = 500;
	            var maxHeight = 500;
	
	            if (img.width > maxWidth || img.height > maxHeight) {
	                // 차원 초과시 경고후 해당 이미지의 차원도 보여줌
	                alert('이미지 차원은 500x500 픽셀 이하여야 합니다.\n\n' + '현재 이미지 차원: ' + img.width + 'x' + img.height + ' 픽셀');
	                el.value = ''; // 파일 입력 필드 초기화
	            }
	        };
	    };
	
	    if (file.length > 0) {
	        // 파일 읽기 시작
	        reader.readAsDataURL(file[0]);
	    }
	}
</script>

 

계속 오류남

1. mapper가 이상하다. 글 등록 쿼리문과 유사하게 만들었는데 작동이 되지 않는 것을 보면 다르게 만들어야 하나 보다. 

 

2. 오류창만 보고 어디가 문제인지 알 수가 없다. 답답하다. 

### The error may involve mapper.fileinsert-Inline
### The error occurred while setting parameters
### SQL: insert into file_study_table   (    file_seq    ,real_name    ,save_name    ,save_path    ,reg_date    ,list_seq   )values(    ( select nvl(max(file_seq), 0)+1 from file_study_table)    ,?    ,?    ,?    ,sysdate    ,listseq   )
### Cause: java.sql.SQLSyntaxErrorException: ORA-00984: column not allowed here

; bad SQL grammar []; nested exception is java.sql.SQLSyntaxErrorException: ORA-00984: column not allowed here
]을(를) 발생시켰습니다.
java.sql.SQLSyntaxErrorException: ORA-00984: column not allowed here

3. fileMap에 key값과 value 값을 넣어주고 있다. 테이블 칼럼은 6개다. 6개의 값을 모두 넣어줘야만 하는가? 

 

4. seq값을 받아와야 하나? map안에는 seq값이 없다. 그럼 뭘 보고 listseq를 설정할 수 있나? 

 

5. 테이블에 값을 집어 넣기 위해서 각 칼럼에 대한 정보가 모두 필요하다. 지금 나는 데이터를 모두 불러오지 못하고 있다. 어디서 가져와야 하는지도 감이 안 잡힌다. 한숨이 나온다. 

 

6. 무엇이 문제인지 아니까 자책하지 말자. 난 지금 mapper 쿼리문을 못 만들고 있다.