파일업로드 : jQuery + Uploadify + ASP.NET
.NET프로그래밍/jQuery 1.3.2 2009. 11. 19. 13:50 |
[Uploadify.htm]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>파일업로드 : jQuery + Uploadify + ASP.NET</title>
<link href="uploadify.css" rel="stylesheet" type="text/css" />
<script src="../../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
<script src="jquery.uploadify.v2.1.0.js" type="text/javascript"></script>
<script src="swfobject.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
// Uploadify 파일 업로드 컨트롤 : Flash가 설치가 되어있어야 함
$('#fileInput').uploadify({
'uploader' : 'uploadify.swf', // Uploadify 컨트롤 지정
'script' : 'Uploadify.ashx', // 서버측 스크립트, ASP.NET, ASP, PHP, JSP
'cancelImg': 'cancel.png', // 취소 이미지
'auto' : false, // true면 파일선택시 바로 자동으로 업로드됨
'folder': '/Uploads', // 업로드할 폴더 : 가상디렉터리 + 업로드폴더
// 업로드 완료시 처리 :
// 주요 속성은 http://www.uploadify.com/documentation/ 참고
'onComplete': function (event, queueID, fileObj, response, data) {
$('#lblFile').append('<a href=/WebJQuery' + fileObj.filePath + '>'
+ fileObj.name + '</a><br>');
}
});
// 버튼 클릭시 업로드
$('#btn').click(function () { $('#fileInput').uploadifyUpload(); });
});
</script>
</head>
<body>
<input id="fileInput" name="fileInput" type="file" />
<input type="button" id="btn" value="업로드" />
<div id="lblFile"></div>
</body>
</html>
-------------------------------------------------------------------------------------
[Uploadify.ashx]
<%@ WebHandler Language="C#" Class="Uploadify" %>
using System;
using System.Web;
public class Uploadify : IHttpHandler {
public void ProcessRequest (HttpContext context) {
// Filedata로 넘겨온 파일 값 받기
HttpPostedFile file = context.Request.Files["Filedata"];
// 저장할 폴더
string targetDirectory = System.IO.Path.Combine(
context.Request.PhysicalApplicationPath,
context.Request["folder"].Replace("/", ""));
// 저장할 폴더 + 파일명
string targetFilePath = System.IO.Path.Combine(
targetDirectory, file.FileName);
// 파일 저장(업로드)
file.SaveAs(targetFilePath);
context.Response.Write("RedPlus");
}
public bool IsReusable {
get {
return false;
}
}
}
-------------------------------------------------------------------------------------
[실행결과]
'.NET프로그래밍 > jQuery 1.3.2' 카테고리의 다른 글
| jQuery PlugIn - Validate (유효성 검사) (0) | 2009.11.23 |
|---|---|
| jQuery를 사용한 한줄메모장 (0) | 2009.11.19 |
| AutoComplete - 텍스트박스 자동 완성 기능 (0) | 2009.11.19 |
| 로테이터(Rotator) 플러그인 (0) | 2009.11.19 |
| 카루셀(Carrousel) 플러그인 (0) | 2009.11.19 |