Многие наверняка сталкивались с элементом управления «FileUpload» () . Моя статья посвящена взаимодействию этого элемента управления с «ASP.NET AJAX».
«Пропарсил» много форумов и заметок всяких программистов, но только вчера, до меня дошло что, все на самом деле просто.
Начнем с того что если не брать «ASP.NET AJAX», а взять к примеру просто «ASP.NET»-страницу то элемент управления «FileUpload» справляется со своей задачей на ура, с этого можно сделать вывод что все не так грустно.
Но как же подружить это дело с «мелкософтовским» AJAX?
Варианты:
1. Воспользоваться расширениями типа ASP.NET AJAX Control Toolkit.
2. «Химичить» с какими-то JavaScript библиотеками вроде jQuery.
3. Воспользоваться тем что изложено ниже.
Шаг №1: (START)
Итак для начала в проекте нашего сайта (который мы естественно не забыли создать), создадим отдельную страницу к примеру под названием «FileUploader.aspx», её можно впихнуть куда угодно главное помнить потом где она.
Шаг №2: (FACE)
Теперь на странице необходимо создать хотя бы 2 элемента управления (FileUpload, Button), но в данном примере еще будет третий (Literal), для отображения информации о состоянии загрузки.
Шаг №3: (CodeBehind)
Сделали лицо, надо сделать фун-л. Как мы уже заметили на кнопке есть ссылка на обработчик «UploadButton_Click» на событие «OnClick», для этого естественно переходим в «CodeBehind» нашей страницы и создаем его.
В ходе дела мы будем использовать GET-запрос, состоящий из одного ключа:
1. «UP» — (Upload Directory) директория, в которую будет загружаться тот самый файл который выберет пользователь. Именно для этого создаем в глобальной области видимости статическую (для того что бы значение нашей переменной не уходило при перегрузке страницы) переменную типа «String» к примеру с похожим названием:
2. Следуем в обработчик «Page_Load» и пишем следующий код для обработки нашего «GET-запроса»:
Теперь при приступим к обработке клика по кнопке:
Шаг №4: (Вызов)
Теперь в нужную часть страницы вставляем «iframe»:
«Пропарсил» много форумов и заметок всяких программистов, но только вчера, до меня дошло что, все на самом деле просто.
Начнем с того что если не брать «ASP.NET AJAX», а взять к примеру просто «ASP.NET»-страницу то элемент управления «FileUpload» справляется со своей задачей на ура, с этого можно сделать вывод что все не так грустно.
Но как же подружить это дело с «мелкософтовским» AJAX?
Варианты:
1. Воспользоваться расширениями типа ASP.NET AJAX Control Toolkit.
2. «Химичить» с какими-то JavaScript библиотеками вроде jQuery.
3. Воспользоваться тем что изложено ниже.
Шаг №1: (START)
Итак для начала в проекте нашего сайта (который мы естественно не забыли создать), создадим отдельную страницу к примеру под названием «FileUploader.aspx», её можно впихнуть куда угодно главное помнить потом где она.
Шаг №2: (FACE)
Теперь на странице необходимо создать хотя бы 2 элемента управления (FileUpload, Button), но в данном примере еще будет третий (Literal), для отображения информации о состоянии загрузки.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FileUploadPage.aspx.cs" Inherits="Behind_FileUploadPage" %>
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>File Upload Page</title>
</head>
<body>
<form id="form1" runat="server" style="color: #FFFFFF;">
<asp:Literal runat="server" ID="lMessageText"></asp:Literal>
<asp:FileUpload runat="server" ID="FileUploadControl" />
<asp:Button runat="server" ID="UploadButton" Text="Upload" OnClick="UploadButton_Click" />
</form>
</body>
</html>
Шаг №3: (CodeBehind)
Сделали лицо, надо сделать фун-л. Как мы уже заметили на кнопке есть ссылка на обработчик «UploadButton_Click» на событие «OnClick», для этого естественно переходим в «CodeBehind» нашей страницы и создаем его.
protected void UploadButton_Click(object sender, EventArgs e)
{
;
}
В ходе дела мы будем использовать GET-запрос, состоящий из одного ключа:
1. «UP» — (Upload Directory) директория, в которую будет загружаться тот самый файл который выберет пользователь. Именно для этого создаем в глобальной области видимости статическую (для того что бы значение нашей переменной не уходило при перегрузке страницы) переменную типа «String» к примеру с похожим названием:
private static String UploadingDirectory;
2. Следуем в обработчик «Page_Load» и пишем следующий код для обработки нашего «GET-запроса»:
protected void Page_Load(object sender, EventArgs e)
{
/// Upload directory.
String UD = "UD";
UploadingDirectory= String.IsNullOrEmpty(Context.Request.QueryString[UD])
? String.IsNullOrEmpty(Context.Request.QueryString[UD.ToLower()])
? "~/"
: Context.Request.QueryString[UD.ToLower()]
: Context.Request.QueryString[UD];
}
Теперь при приступим к обработке клика по кнопке:
// Проверяем не пустая ли строка.
if (!String.IsNullOrEmpty(UploadDirectory))
{
// Берем свойство "HasFile" для того что бы знать что файл действительно приготовлен к загрузке
if (FileUploadControl.HasFile)
{
try
{
// Получаем имя файла.
String fileName = Path.GetFileName(FileUploadControl.FileName);
// Проверем на дубликат файла на сервере.
if (File.Exists(fileName))
fileName = String.Format(
"CopyOf_{0}",
fileName
);
// Сохраняем файл на сервер.
FileUploadControl.SaveAs(Server.MapPath(UploadDirectory) + fileName);
// Выводим месседж если все ок!
lMessageText.Text = "<b style='color: green;'>Загружено!</b>";
}
catch (Exception exc)
{
// Выводим месседж если все плохо.
lMessageText.Text = "<b style='color: red;'>Не загружено!</b>";
}
}
}
Шаг №4: (Вызов)
Теперь в нужную часть страницы вставляем «iframe»:
<iframe src="путь_к_нашей_странице/FileUploader.aspx?UD=~/Resources/"></iframe>