jQuery drag and drop multi file upload aljjabaegi.fileUpload-1.0.1.js

jQuery drag and drop multi file upload aljjabaegi.fileUpload.js

 

aljjabaegi.fileUpload-1.0.0.js 는 아래의 Link를 참고하세요.

 

Link : jQuery FormData ajax multi file upload drag and drop 비동기 파일 업로드

jQuery FormData ajax multi file upload drag and drop 비동기 파일 업로드

복수의 파일 객체 처리가 추가되었습니다.

 

<script>
"use strick";
var option = {
    url : '${ctx}/upload.do',
    title : ['IVS', 'CENTER'],
    type : ['multi', 'single'],
    uploadBtnId : 'viewPop',
    validation : {
        extension : ['log', 'txt'],
        size : 10000000000,
    },
    submit : function(){
        AU.validationChk();
        /*실제 전송할 폼데이터*/
        var formData = AU.getFormData();
        /*파일명 배열*/
        var fileNm = AU.getFileNm();
        console.log(fileNm);
        /*파일객체 배열*/
        var files = AU.getFile();
        console.log(files);
    },
}
$(function(){
    AU.setFileUpload(option);
});
</script>

 

위와 같이 타이틀과 타입을 배열로 선언 할 경우,

해당 객체는 복수 파일 업로드로 판단하여 UI가 변경되게 됩니다.

타이틀과 타입의 length는 일치하여야합니다.

 

배열이 아닐경우

2개일 경우

3개일 경우

4개일 경우

기존에 사용하던 파일객체와 명을 리턴받는 함수명도 변경되었습니다.

 

함수명	설명
getFormData	전체 파일 객체의 파일이 추가된 FormData를 리턴 받는다.
getFileNm	전체 파일의 명을 배열로 리턴 받는다. 파일객체의 인덱스를 매개변수로 넘길 경우 해당 개체의 파일명만 리턴한다.
getFile	전체 파일 객체를 배열로 리턴 받는다. 파일객체의 인덱스를 매개변수로 넘길 경우 해당 개체의 파일만 리턴한다.

 

파일을 업로드한 경우

aljjabaegi.fileUpload-1.0.2.zip

0.14MB

 

[수정내역]

1.0.2 - clearFile함수에 input[type='file']  초기화 기능 추가 (업로드 후 같은 파일 다시 업로드 시 추가 안되는 현상)