Управление HTML-элементами в ASP.NET
Упражнение 7. Элемент управления HTMLInputFile
Класс HTMLInputFile позволяет программировать HTML-тег <input type="file">. Этот тег используется для работы с данными файла в пределах формы HTML. В теге <form> мы будем использовать атрибут enctype="multipart/form-data", без которого Web-страница выдаст ошибку. В нашем сценарии при нажатии кнопки страница будет загружать файл на сервер и выдаст сообщение при успешном завершении, в противном случае она должна отображать сообщение об ошибках, указывающих на причину сбоя.
Встретив тег <input type="file">, броузер автоматически размещает кнопку Browse рядом с текстовым полем, чтобы дать возможность пользователю через диалоговое окно выбрать выгружаемый на сервер файл. Нажатие кнопки Open размещает имя выбранного файла и путь к нему в текстовом поле страницы.
-
Добавьте
к проекту новую страницу (шаблон Web Form)
с именем HTMLInputFile.aspx и
файлом отделенного кода, назначьте ее стартовой для удобства
отладки -
Перейти
из режима Design визуального проектирования
в режим Source (то же самое можно сделать
через меню оболочки View/Code или контекстное
меню редактора страницы командой View Code )
-
Отредактируйте
интерфейсную часть страницы HTMLInputFile.aspx так
<%@ Page Language="C#" AutoEventWireup="true"
CodeFile="HTMLInputFile.aspx.cs" Inherits="HTMLInputFile" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Элемент управления HTMLInputFile</title>
</head>
<body>
<center>
<h1>
Элемент управления HTMLInputFile</h1>
<font color="#ff0000">
<h2 id="State" runat="server" />
</font>
<form id="form1" runat="server"
enctype="multipart/form-data" method="post">
Имя отсылаемого файла:
<input id="FileName" runat="server"
maxlength="30" type="file">
<p />
Переслать под именем (без пути):
<input id="Text" runat="server" type="text">
<p />
<input id="TransferFile" runat="server"
type="button" value="Передать файл">
</form>
<hr>
<a id="PrevLink" runat="server">Назад</a>
<a id="NextLink" runat="server">Вперед</a>
</center>
</body>
</html>
Листинг
3.14.
Интерфейсная часть страницы HTMLInputFile.aspx
-
Перейдите
в режим дизайна страницы HTMLInputFile.aspx и
двойным щелчком на кнопке TransferFile создайте обработчик
в ассоциированном файле поддержки HTMLInputFile.aspx.cs
-
Отредактируйте
файл поддержки HTMLInputFile.aspx.cs так
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class HTMLInputFile : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
PrevLink.HRef = "HTMLInputCheckBox.aspx";
NextLink.HRef = "HTMLInputHidden.aspx";
}
protected void TransferFile_ServerClick(object sender, EventArgs e)
{
if (FileName.Value == "")
{
State.InnerHtml = "Выберите отсылаемый файл";
return;
}
else if (Text.Value == "")
{
State.InnerHtml = "Введите имя целевого файла";
return;
}
if (FileName.PostedFile != null)
{
try
{
FileName.PostedFile.SaveAs("c:\ emp\\" + Text.Value);
State.InnerHtml = "Файл c:\ emp\\" +
Text.Value + " передан успешно на Web server";
}
catch (Exception exc)
{
State.InnerHtml = "Ошибка записи файла c:\ emp\\" +
Text.Value + "<br>" + exc.ToString();
}
}
}
}
Листинг
3.15.
Кодовый файл HTMLInputFile.aspx.cs
-
Постройте
проект. Результат внешне будет примерно таким
Упражнение 8. Элемент управления HTMLInputHidden
Этот класс позволяет программировать HTML-тег <input type="hidden">, который используется для скрытой передачи данных на сервер. Разработаем страницу, в которой сервер будет возвращать содержимое тега в открытом виде. Код управления объектом на C# разместим на странице вместе с интерфейсной частью.
-
Выполните
команду меню оболочки для вызова мастера добавления в
проект новой HTML-страницы с именем HTMLInputHidden.aspx
Расширение .aspx нужно для того, чтобы диспетчер страниц на стороне сервера при поступлении запроса от броузера на ее поставку, вначале передал страницу на обработку IIS-серверу.
-
Установите
режим Source редактирования новой страницы
и заполните ее кодом, приведенным ниже (интерфейсная и
кодовая части на одной странице)
<script runat="server" language="C#">
void ButtonShow_Click(object Source, EventArgs e)
{
State.InnerText = HiddenField.Value;
}
void ButtonHidden_Click(object Source, EventArgs e)
{
State.InnerText = "";
}
</script>
<html>
<head>
<title>Элемент управления HTMLInputHidden</title>
</head>
<body>
<center>
<h1>
Элемент управления HTMLInputHidden</h1>
<font color="#ff0000">
<h2 id="State" runat="server" />
</font>
<form id="form1" runat="server" method="post">
<p>
Нажмайте на кнопки для показа/сокрытия секретной информации</p>
<input id="ShowButton" runat="server"
onserverclick="ButtonShow_Click" type="button"
value="Показать секретную информацию">
<p>
</p>
<input id="HiddenButton" runat="server"
onserverclick="ButtonHidden_Click" type="button"
value="Скрыть секретную информацию">
<input id="HiddenField" runat="server" type="hidden"
value="Это скрытое значение поля Hidden">
</form>
<hr>
<a href="HTMLInputFile.aspx">Назад</a>
<a href="HTMLInputImage.aspx">Вперед</a>
</center>
</body>
</html>
Листинг
3.16.
Код страницы HTMLInputHidden.aspx
-
Сделайте
страницу стартовой и постройте приложение. Результат должен
быть таким
В этой странице мы не стали создавать ассоциированный файл CodeBehind для тренировки, хотя смешивать представление страницы и код управления ею не совсем удобно. Да и возможности по программированию в чисто кодовом файле C# привычнее. Мы, как программисты, внутри файла CodeBehind находимся в своей стихии и можем спокойно там расположить всю бизнес-логику управления представлением. Главное - чтобы были известны идентификаторы всех элементов управления, используемых на странице представления.