Практическая работа по теме 6. "Методы программирования, применяемые в Web"

Практическая работа по теме 6. "Методы
программирования, применяемые в Web"
Доступ к базе данных с помощью ASP.NET технологии. Привязка данных
элементу управления DataGrid. Обновление информации в базе данных
помощью элемента управления DataGrid. Отображение связанной информации
Web-формах. Создание страницы регистрации: реакция на события. Вычисления
Web-страницах.
к
с
в
в
Оглавление
Задание 1. Доступ к базе данных с помощью ASP.NET технологии
Задание 2. Привязка данных к элементу управления DataGrid
Задание 3. Обновление информации в базе данных с помощью элемента
управления DataGrid
Задание 4. Отображение связанной информации в Web-формах
Задание 5. Создание страницы регистрации: реакция на события
Задание 6. Выполнение вычислений на Web-страницах
Задание 1. Доступ к базе данных с помощью
ASP.NET технологии
Цель
Включить учетную запись ASP.NET в состав учетных записей SQL Server.
Решение
Использовать программу SQL Server Enterprise Manager для формирования
учетной записи.
Обсуждение
Безопасное подключение к базе данных в концепции .NET реализуется с
помощью пространства имен System.Data и строки подключения. Одним из
параметров этой строки является параметр TRUSTED_CONNECTION, который
означает применение надежного подключения, то есть пользователь должен быть
идентифицирован операционной системой Windows, а аутентифицирующая
информация о нем должна храниться в SQL Server.
Для
создания
надежного
подключения
на
основе
параметра
TRUSTED_CONNECTION необходимо иметь учетную запись операционной среды
Windows, которую следует включить в состав учетных записей SQL Server.
1. Откройте программу SQL Server Enterprise Manager (Пуск - Программы Microsoft SQL Server - Enterprise Manager). Раскройте узел используемой базы
данных и узел Security (Безопасность), как показано на рис. 6.1.
Рис. 6.1. Выбор узла Security в SQL Server Enterprise Manager
2. Щелкните правой кнопкой мыши на элементе Logins (Учетные записи) и
выберите команду New Login (Создать учетную запись). На экране появится
диалоговое окно SQL Server Login Properties - New Login (Свойства учетных
записей SQL Server - Создать учетную запись), как показано на рис. 6.
Рис. 6.2. Диалоговое окно SQL Server Login Properties - New Login
3. Во вкладке General в текстовом поле Name укажите учетное имя
пользователя, выбрав его с помощью щелчка на кнопке с многоточием, или
введите в одном из форматов: "компьютер/ пользователь", "домен/ пользователь"
(рис.6.3).
Рис. 6.3. Выбор учетного имени пользователя
4. Найдите в списке учетную запись ASPNET и выберите ее.
5. В списке Database выберите свою базу данных (рис.6.4).
Рис. 6.4. Выбор базы данных в списке Database вкладки General
6. На вкладке Database Access установите флажок против имени вашей базы
данных. В списке Database Roles for "Имя базы" установите флажок роли public
(рис. 6.5).
Рис. 6.5. Выбор базы данных и роли пользователя
7. Выберите роль public и щелкните на кнопке Properties (рис. 6.6).
Рис. 6.6. Свойства роли public
8. Щелкните по кнопке Permissions. Убедитесь в том, что выбран
переключатель List all objects, и прокрутите список до конца, чтобы увидеть все
таблицы из вашей базы данных. Установите флажки всех таблиц в столбце
SELECT (рис. 6.7).
Рис. 6.7. Диалоговое окно для низкоуровневого указания разрешения пользователя
9. На этом этапе установите также флажки в столбцах INSERT, UPDATE и
DELETE, как показано на рис. 6.8. Это позволит пользователю модифицировать
записи базы данных.
Рис. 6.8. Установка разрешения на операции вставки, удаления и замены в таблицы
10. После выполнения этих действий для закрытия этого и двух других
диалоговых окон щелкните на кнопке OK в каждом из них. После этого в списке
учетных записей Logins в окне программы SQL Server Enterprise Manager появится
пользователь ASPNET (рис. 6.9).
Рис. 6.9. Список учетных записей Logins в окне программы SQL Server Enterprise
Manager
Итак, учетная запись ASPNET включена в список учетных записей SQL Server. В
следующем задании рассмотрим, как использовать созданную учетную запись для
подключения к базе данных без указания в строке подключения какой-либо
информации об имени и пароле учетной записи.
Самостоятельно
Сформируйте учетную запись для доступа к собственной базе данных на SQL
Server.
Задание 2. Привязка данных к элементу управления
DataGrid
Задача
Осуществить доступ к базе данных в Web-среде с помощью Web-браузера.
Решение
Применить параметр TRUSTED_CONNECTION для подключения к базе данных и
элемент управления DataGrid для отображения данных в Web-форме.
Обсуждение
Привязка данных к элементам управления вэб-форм во многом напоминает
привязку данных к формам Windows-приложений. Обе формы являются
достаточно гибкими и позволяют связывать множество свойств элемента
управления с данными из различных источников. Однако существуют некоторые
различия между этими формами, которые необходимо изучить.
В первую очередь, по своему назначению вэб-формы обычно являются
доступными только для чтения. Другими словами, после создания страницы, она
преобразовывается в понятный для браузера формат HTML, и представляет собой
информацию, доступную только для чтения, которую пользователь не может
изменить.
Архитектура привязки данных для вэб-форм не позволяет автоматически
записывать изменения в источник данных. Такой подход кардинально отличается
от Windows-форм, где содержимое объекта DataSet обновляется автоматически
при редактировании текстовых полей элемента управления DataGrid. Чтобы
воплотить в жизнь подобную функциональность в среде вэб, нам придется
создавать программный код вручную.
 Создайте новый проект с вэб-формой (ASP.NET Web Application).
 Разместите в новой вэб-форме элемент управления DataGrid. Наша
новая форма должна выглядеть приблизительно так, как показано на
рис. 6.10.
 Перед началом объявления класса задайте операторы импортирования
пространств имен:
Imports
System.Data
Imports System.Data.SqlClient
Рис. 6.10. Проект Web-формы
 Внутри объявления класса (после строки Public Class WebForm1),
задайте
строку
инициализации
подключения,
которое
будет
инициироваться в форме:
Dim strConnection As String = "server=(local);
database=EmployeeInfo;
TRUSTED_CONNECTION=YES"
 Напишите процедуру обработки загрузки вэб- страницы (код ниже):
Private
Sub
LoadData()
Создадим
объект
Connection,
выполним
его
инициализацию
Dim
cnn
As
New
SqlConnection(strConnection)
Создадим объект SqlCommand, в качестве свойства
CommandText зададим оператор SQL для извлечения
информации
из
базы
данных
Dim cmd As New SqlCommand("SELECT FirstName,
LastName, DepartmentID, Salary FROM Employees",
cnn)
Откроем
соединение
с
базой
данных
cnn.Open()
Создадим
объект
DataReader
для
хранения
извлеченной из базы данных информации. Выполним
оператор SQL с помощью метода ExecuteReader
объекта
Command
Dim
dReader
As
SqlDataReader
=
cmd.ExecuteReader(CommandBehavior.CloseConnection)
Свяжем элемент управления DataGrid с объектом
DataReader
DataGrid1.DataSource
=
dReader
DataGrid1.DataBind()
Закрываем
объект
DataReader
и
разрываем
соединение
с
базой
данных
dReader.Close()
cnn.Close()
End Sub
Приводимый ниже программный код следует поместить в обработчике события
Page_Load:
Private
Sub
Page_Load(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
MyBase.Load
If
Not
Page.IsPostBack
Then
LoadData()
End
If
End Sub
При запуске вашего приложения вы должны получить приблизительно такую
вэб-форму (рис.6.11).
Рис. 6.11. Web-форма при запуске
Полученная форма внешне мало отличается от элемента управления DataGrid в
обычном Windows-приложении, но при попытке модификации данных через эту
форму вам придется писать дополнительный программный код.
Самостоятельно
Отредактируйте HTML-код, сгенерированный автоматически при создании вэбформы, для изменения внешнего вида формы. Добавьте цвет фона, формат
шрифта и другие атрибуты в тэги элементов управления. Примерный вид
измененной формы может быть таким, как на рис. 6.12.
Задание 3. Обновление информации в базе данных с
помощью элемента управления DataGrid
Задача
Написать программный код, позволяющий вносить изменения в базу данных с
помощью вэб-формы и элемента управления DataGrid.
Решение
Отредактировать HTML-код, генерируемый автоматически при создании вэбформы,
и
написать
программный
код
для
выполнения
процедур
OnUpdateCommand, OnDeleteCommand, OnCancelCommand и OnEditCommand.
Обсуждение
Во-первых, нам необходимо открыть форму в режиме конструктора, а затем
перейти
к
просмотру
HTML-кода.
HTML-код,
который нам
предстоит
редактировать, приводится ниже:
< HTML>< HEAD>< title>WebForm1< /title> < meta
content="Microsoft
Visual
Studio
.NET
7.1"
name="GENERATOR"> < meta content="Visual Basic
.NET
7.1"
name="CODE_LANGUAGE">
<
meta
content="JavaScript" name="vs_defaultClientScript"> <
meta
content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema"><
/HEAD>
<
body
MS_POSITIONING="GridLayout"> < form id="Form1"
method="post"
runat="server">
<
asp:datagrid
id="DataGrid1" style="Z-INDEX: 101; LEFT: 64px;
POSITION: absolute; TOP: 40px" runat="server"
Height="216px"
Width="320px"
OnUpdateCommand="OnUpdateCommand"
OnDeleteCommand="OnDeleteCommand"
OnEditCommand="OnEditCommand"
OnCancelCommand="OnCancelCommand"
AutoGenerateColumns="False" GridLines="Horizontal" >
<
SelectedItemStyle
HorizontalAlign=Center><
/SelectedItemStyle>
<
EditItemStyle
HorizontalAlign=Center><
/EditItemStyle>
<
AlternatingItemStyle
HorizontalAlign=Center
ForeColor="Black"
BackColor="DarkSalmon"><
/AlternatingItemStyle>
<
ItemStyle
HorizontalAlign=Center
ForeColor="Black"
BackColor="White">< /ItemStyle> < HeaderStyle FontBold=True
ForeColor="Black"
BackColor="LightSteelBlue"><
/HeaderStyle>
<
Columns><
asp:EditCommandColumn
ButtonType="LinkButton"
UpdateText="Update"
CancelText="Cancel"
EditText="Edit">
<
/asp:EditCommandColumn>
<
asp:ButtonColumn
Text="Delete"
CommandName="Delete">
<
/asp:ButtonColumn>
<
asp:BoundColumn
DataField="FirstName"
ReadOnly="True"
HeaderText="FirstName">
<
HeaderStyle
HorizontalAlign="Center"
Width="150px"><
/HeaderStyle> < ItemStyle HorizontalAlign="Center"><
/ItemStyle>< /asp:BoundColumn> < asp:BoundColumn
DataField="LastName"
HeaderText="LastName">
<
HeaderStyle
HorizontalAlign="Center"
Width="150px"><
/HeaderStyle>
<
ItemStyle
HorizontalAlign="Center"><
/ItemStyle><
/asp:BoundColumn>
<
asp:BoundColumn
DataField="DepartmentId"
ReadOnly="True"
HeaderText="DepartmentId">
<
HeaderStyle
HorizontalAlign="Center"
Width="150px"><
/HeaderStyle> < ItemStyle HorizontalAlign="Center"><
/ItemStyle>< /asp:BoundColumn> < asp:BoundColumn
DataField="Salary"
HeaderText="Salary">
<
HeaderStyle
HorizontalAlign="Center"
Width="150px"><
/HeaderStyle>
<
ItemStyle
HorizontalAlign="Center"><
/ItemStyle>
<
/asp:BoundColumn>< /Columns>< /asp:datagrid><
/form>< /body>< /HTML>
В этом фрагменте HTML-кода необходимо выделить несколько важных
моментов. Прежде всего, обратите внимание на объявление объектов Command,
которые будут запускаться при вызове соответствующей операции:
OnUpdateCommand="OnUpdateCommand"
OnDeleteCommand="OnDeleteCommand"
OnEditCommand="OnEditCommand"
OnCancelCommand="OnCancelCommand"
Если пользователь щелкнет на гиперссылке Update в вэб-форме, будет вызвана
процедура OnUpdateCommand. Реализацию этой и других процедур необходимо
описать позже.
Просмотрите также форматирование для элемента управления DataGrid,
которое позволяет представить его в более привлекательном виде, чем раньше.
Обратите также внимание на выбор столбцов, которые отображаются в таблице.
Следует пояснить способ определения EditCommandColumns и то, как задается
отображаемая для пользователя надпись.
asp:EditCommandColumn
ButtonType="LinkButton"
UpdateText="Update"
CancelText="Cancel"
EditText="Edit">/asp:EditCommandColumn>
Если пользователь щелкнет на гиперссылке Edit, то откроется строка таблицы с
возможность редактирования тех полей, для которых не указано свойство
ReadOnly, равным True, и командами Update, Cancel, Delete (рис. 6.12).
После написания основного HTML-кода для элемента управления DataGrid,
можно добавлять программный код, предназначенный для модификации данных,
чтобы при выборе пользователем некоторой гиперссылки (Edit, Delete, Cancel,
Update), выполнялись соответствующие операторы.
Если вы все еще находитесь в режиме просмотра кода HTML, перейдите в
режим конструктора. По двойному щелчку мыши должно открыться окно с
программным кодом, в котором вам необходимо создать следующую процедуру
ExecuteSQL:
Private Sub ExecuteSQL(ByVal strSQL As String)
Эта процедура вызывает оператор SQL для внесения изменений в базу данных
Dim
cmd
As
New
Dim cnn As New SqlConnection
SqlCommand
Свяжем строку инициализации с объектом Connection
cnn.ConnectionString = strConnection
Зададим в свойстве CommandText командного объекта оператор SQL, который
будет использоваться для извлечения информации из базы данных
cmd.CommandText = strSQL
Свяжем свойство Connection командного объекта с объектом Connection
cmd.Connection
Откроем
cnn.Open()
=
cnn
подключение
Выполним оператор SQL при помощи объекта Command
cmd.ExecuteNonQuery()
Закроем подключение к базе данных
cnn.Close()
End Sub
Данная процедура предназначена для запуска оператора SQL, применяемого к
самой базе данных. Мы будем использовать эту процедуру для вызова команд
UPDATE и DELETE при выборе пользователем соответствующей гиперссылки.
Рис. 6.12. Форматирование элемента управления DataGrid
Далее нам нужно описать четыре отдельных процедуры, выполняемых при
выборе пользователем соответствующих ссылок. Вспомним, что в HTML-коде для
события OnEditCommand мы задали имя "OnEditCommand". Это означает, что нам
необходимо создать процедуру с таким именем, и поместить в ее код обработчик
нажатия ссылки Edit. Подобна процедура будет выглядеть приблизительно так:
Public Sub OnEditCommand(ByVal sender As Object,
ByVal e As DataGridCommandEventArgs)
Процедура активизируется при выборе гиперссылки Edit. Выбираем элемент
для редактирования:
DataGrid1.EditItemIndex = e.Item.ItemIndex
Загружаем данные:
LoadData()
End Sub
В процедуре OnEditCommand осуществляется выборка редактируемого
элемента в таблице DataGrid на основе информации о выделенной пользователем
позиции на момент нажатия гиперссылки Edit. При переходе в режим
редактирования, все доступные для редактирования столбцы данной строки
приобретают вид текстовых полей, значения в которых пользователь может
изменять. Для придания дополнительной гибкости вместо текстовых полей вы
можете создать временные столбцы с элементами управления "комбинированный
список" или другими элементами управления.
Далее, добавим текст процедуры OnUpdateCommand:
Public Sub OnUpdateCommand(ByVal sender
Object, ByVal e As DataGridCommandEventArgs)
As
Процедура запускается при выборе пользователем гиперссылки Update.
Извлекаем значение ключевого поля FirstName и сохраняем его в локальной
переменной
Dim
FirstName
FirstName = e.Item.Cells(2).Text
As
String
Извлечем значение, только что измененное пользователем в поле LastName
Dim
txtLastName
As
New
TextBox
txtLastName
=
e.Item.Cells(3).Controls(0)
Dim LastName As String = txtLastName.Text
Пользователь также может изменить значение поля Salary, сохраним новое
значение в локальной переменной:
Dim
txtSalary
As
New
TextBox
txtSalary
=
e.Item.Cells(5).Controls(0)
Dim Salary As Integer = Val(txtSalary.Text)
Сформируем SQL строку для выполнения обновления в базе данных
Dim
strSQL
As
String
strSQL = "UPDATE Employees SET LastName=' " &
LastName
&
"
'
"
strSQL += " , Salary = '" & Salary & "'"
strSQL += "WHERE FirstName='" & FirstName & "'"
Сохраняем изменения в базе данных с помощью процедуры ExecuteSQL
ExecuteSQL(strSQL)
Переходим обратно в режим просмотра таблицы
DataGrid1.EditItemIndex = -1
Загружаем обновленные данные из базы данных в DataGrid
LoadData()
End Sub
Добавим в форму еще одну процедуру -OnDeleteCommand. Программный код
процедуры представлен ниже:
Public Sub OnDeleteCommand(ByVal sender As Object,
ByVal e As DataGridCommandEventArgs)
Процедура вызывается при выборе пользователем гиперссылки Delete.
Извлекаем
ключевое
поле
текущей
строки
Dim
FirstName
As
String
FirstName
=
e.Item.Cells(2).Text
Определяем оператор SQL, задаем для него в
качестве параметра FirstName строки, подлежащей
удалению
Dim
strSQL
As
String
strSQL = "DELETE Employees WHERE FirstName= '" &
FirstName
&
"
'"
Удаляем
строку
из
базы
данных
ExecuteSQL(strSQL)
Возвращаемся
в
режим
просмотра
DataGrid1.EditItemIndex
=
-1
Повторная загрузка данных с целью подтверждения
внесенных
изменений
LoadData()
End Sub
И, наконец, напишем программный код для процедуры OnCancelCommand. Эта
процедура будет вызываться при выборе пользователем ссылки Cancel и
выполнять выход из режима редактирования без сохранения изменений. Добавим
в объявление формы следующий программный код:
Public Sub OnCancelCommand(ByVal sender As Object,
ByVal e As DataGridCommandEventArgs)
Процедура запускается при выборе пользователем гиперссылки Cancel.
Отменяем
выбор
DataGrid1.EditItemIndex
Обновляем
данные
LoadData()
End Sub
=
в
элементов:
-1
форме.
Самостоятельно
Протестируйте полученное приложение в режимах изменения и удаления
данных.
Создайте Web-форму для просмотра и редактирования списка отделов из
таблицы Departments.
Задание 4. Отображение связанной информации в
Web-формах
Задача
Написать программный код, позволяющий выполнять отображение информации
из связанных таблиц базы данных и вносить изменения в базу данных с помощью
вэб-формы и элемента управления DataGrid.
Решение
Добавить в форму элемент управления ListBox для отображения значений
связанной таблицы и написать программный код, позволяющий синхронизировать
вывод информации из другой таблицы в DataGrid.
Обсуждение
Вэб -страница, созданная в задании 3, позволяет отображать и редактировать
информацию из единственной таблицы Employees базы данных EmployeeInfo. Вы
должны были обратить внимание на тот факт, что поле DepartmentID в
спроектированной
форме
не
подлежит
редактированию.
Попробуем
усовершенствовать Web-страницу с тем, чтобы отображать информацию из
связанных таблиц Employees и Departments
.
Добавим в форму элемент управления ListBox, который будет отображать
информацию из таблицы Departments. Добавить элемент "список" можно
непосредственно при проектировании формы, а можно описание кода HTML
страницы:
< asp:Label id="Label1" style="Z-INDEX: 102; LEFT:
64px; POSITION: absolute; TOP: 40px" runat="server"
Width="64px" Height="24px">Отделы< /asp:Label> <
asp:DropDownList ID="ListDep" Runat="server" FontName="Verdana" forecolor="Black" Font-Size="12"
style="Z-INDEX: 103; LEFT: 168px; POSITION:
absolute;
TOP:
40px"
Width="192px"><
/asp:DropDownList>
<
asp:Button
id="Button1"
style="Z-INDEX: 104; LEFT: 392px; POSITION:
absolute; TOP: 40px" runat="server" Width="88px"
Text="Показать">< /asp:Button>
Приведенный выше HTML-код позволяет создать в Web-странице три элемента:
надпись, выпадающий список и командную кнопку. Список должен содержать
данные из таблицы Departments, кнопка - синхронизировать данные из двух
таблицы: Employees и Departments. Добавим в код формы процедуру
инициализации списка значениями из таблицы Departments.
Private Function LoadList() As SqlDataReader
Установим соединение с базой данных
Dim cnn As New SqlConnection(strConnection)
Создадим объект Command для выполнения SQL для выполнения SQL запроса к
таблице Departments
Dim cmd As New SqlCommand("SELECT * FROM
Departments", cnn)
Откроем соединение
cnn.Open()
Создадим объект DataReader для сохранения результатов выполнения метода
ExecuteReader объекта Command
Dim
dReader
cmd.ExecuteReader()
As
SqlDataReader
=
Поскольку, мы организовали процедуру чтения таблицы Departments как
функцию, необходимо описать возвращаемые значения
Return
dReader.Close()
cnn.Close()
End Function
dReader
Имея содержимое таблицы Departments в объекте DataReader необходимо
отобразить данные в форме с помощью элемента "список". Внесем
соответствующие изменения в процедуру загрузки вэб-страницы:
Private
Sub
Page_Load(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
MyBase.Load
If Not Page.IsPostBack Then
Выполним связывание данных, полученных из базы данных и элемента
управления DropDownList, к которому мы обращаемся как ListDep, так как в HTMLкоде указали ID="ListDep"
ListDep.DataSource = LoadList()
Удобнее, если пользователь будет видеть название отдела, а не его код
ListDep.DataTextField = "DepartmentName"
Но при выборе строки списка необходимо сохранить значения поля ID
ListDep.DataValueField = "ID"
Выполним связывание данных, отображенных с помощью списка
ListDep.DataBind()
Это вызов процедуры загрузки таблицы DataGrid, код формирования которой
следует изменить (смотри ниже)
LoadData()
End
End Sub
If
Код загрузки элемента DataGrid, отображающего данные таблицы Employees,
следует привести в соответствие с поставленной задачей - отображением только
выбранных записей таблицы.
Private Sub LoadData()
Создадим объект Connection для выполнения соединения с базой данных
Dim cnn As New SqlConnection(strConnection)
Создадим объект DataSet для локального хранения данных, полученных в
результате выполнения запроса к базе данных
Dim ds As New DataSet
С помощью адаптера данных выполним запрос к базе данных
Dim da As New SqlDataAdapter("SELECT * FROM
Employees", cnn)
Для фильтрации информации в соответствии с выбранным элементом из списка
отделов можно использовать объект DataView
Dim dv As New DataView
Открываем соединение с базой данных
cnn.Open()
Метод Fill адаптера данных позволяет заполнить объект
da.Fill(ds, "Employees")
Свяжем объект DataView с таблицей Employees, размещенной в объекте
DataSet
dv.Table = ds.Tables("Employees")
Объект DataView имеет свойство RowFilter, позволяющее
фильтрацию данных в соответствии с указанными критериями
dv.RowFilter
=
"DepartmentID='"
Val(ListDep.SelectedValue) & " '"
выполнять
&
Отобразим полученные после фильтра данные в Web-странице посредством
табличного элемента управления DataGrid
DataGrid1.DataSource = dv
Выполним связывание данных, представленных в форме
DataGrid1.DataBind()
cnn.Close()
End Sub
Таким образом, приведенный код измененной процедуры загрузки данных в
элемент управления DataGrid демонстрирует другой прием работы с базой данных
- отсоединенную технологию с использованием объекта DataSet.
Осталось добавить тривиальную процедуру обработки щелчка по командной
кнопке:
Private
Sub
Button1_Click(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
Button1.Click
LoadData()
End Sub
Дайте название "Сотрудники" Web-странице с помощью свойств страницы
Properties. Окончательный вид Web-страницы Сотрудники показан на рис. 6.13.
Самостоятельно
Для вызова процедуры загрузки отфильтрованных данных в элемент DataGrid
была использована командная кнопка. Удалите из формы командную кнопку и
свяжите вызов процедуры загрузки в DataGrid с процедурой обработки изменения
выбранного индекса в элементе управления список. Другими словами, пусть
выбор новой строки в списке отделов будет вызывать изменения в DataGrid без
использования дополнительных элементов управления.
Рис. 6.13. Web-представление для связанных таблиц базы данных
Задание 5. Создание страницы регистрации:
реакция на события
Задача
Первая страница Web-приложения должна быть страницей регистрации, на
которой выполняется идентификация пользователей. Страница регистрации также
должна регламентировать доступ пользователей к определенным страницам
приложения.
Решение
Создать в базе данных новую таблицу для хранения регистрационных
сведений.
Спроектировать
и
запрограммировать
страницу
регистрации
пользователей.
Обсуждение
Для хранения регистрационных сведений о пользователях приложения к базе
данных EmployeeInfo необходимо добавить в структуру базы данных EmployeeInfo
еще одну таблицу, которая не будет иметь непосредственного отношения к самой
базе данных, но будет содержать сведения о пользователях этой базы данных.
1. Сформируйте таблицу LoginDetails и поместите ее в схеме базы данных
EmployeeInfo. Структура таблицы приведена на рис. 6.14.
Рис. 6.14. Структура таблицы идентификации пользователей
2. Внесите в таблицу несколько строк
идентифицировать пользователей приложения.
для
проверки
возможности
3. Не забудьте обновить учетную запись для доступа к базе данных.
Необходимо включить таблицу LoginDetails в список доступных таблиц базы
данных (рис. 6.15).
Рис. 6.15. Обновление учетной записи для доступа к базе данных
Создадим страницу регистрации пользователей. Страница должна содержать
поля для ввода login и password. Приложение должно выполнить проверку
допустимости введенной информации с помощью таблицы LoginDetails. Если
регистрационное имя окажется ошибочным, приложение должно выдать
пользователю соответствующее сообщение об ошибке. После успешной
регистрации должна появиться Web-страница доступа к базе данных Сотрудники,
созданная нами ранее.
Для того чтобы пользователи не смогли пропустить страницу регистрации, на
странице Сотрудники будет добавлен алгоритм проверки того, что пользователь
попал на данную страницу именно со страницы регистрации. В противном случае
пользователь будет отправлен на страницу регистрации. Для создания страницы
регистрации необходимо выполнить следующие действия:
c
4. Создайте новую Web-форму. Измените значение свойства pageLayout формы
GridLayout на FlowLayout. Это изменение устройства формы позволит
располагать объекты сверху вниз, также как, например, в программах текстовых
редакторов.
5. Добавьте элементы управления на форму, как показано на рис. 6.16.
Рис. 6.16. Проект страницы для регистрации пользователя
6. Установите свойство TextMode элемента управления txtPassword равным
Password. Этот режим гарантирует, что вместо алфавитных символов будут
выводиться символы звездочки при наборе пароля пользователя.
7. Теперь можно улучшить внешний вид Web-формы. Переключитесь в окно
HTML-кода и добавьте форматирование, например, такое, как приведено ниже:
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN"> < HTML>< HEAD>< title>WebForm2<
/title> < meta name="GENERATOR" content="Microsoft
Visual
Studio
.NET
7.1">
<
meta
name="CODE_LANGUAGE" content="Visual Basic .NET
7.1">
<
meta
name="vs_defaultClientScript"
content="JavaScript"> < meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5"><
/HEAD> < body>< form id="Form1" method="post"
runat="server">
<
TABLE
style="WIDTH:346px;
HEIGHT:27px"
cellSpacing="1"
align="center"
border="1">< TR>< TD>Регистрация пользователя<
/TD>< /TR>< /TABLE> < p align="center">< asp:Label
ID="lblMessage"
Runat="server"
Visible="False"
ForeColor="red" Borderstyle="None">Label< /asp:Label><
/p> < TABLE style="WIDTH:308px; HEIGHT:110px"
cellSpacing="0" align="center" border="1">< TR>< TD
style="WIDTH:138px">Выберите форму для работы<
/TD> < TD style="HEIGHT:22px">< asp:DropDownList
ID="ddlEntity"
Runat="server"
Width="156px"><
/asp:DropDownList>< /TD>< /TR>< TR> < TD style="
WIDTH:138px; HEIGHT:22px">LoginID< /TD> < TD
style=" HEIGHT:22px">< asp:TextBox ID="txtLoginID"
Runat="server" Width="155px">< /asp:TextBox>< /TD><
/TR>
<
TR><
TD
style="
WIDTH:138px;
HEIGHT:25px">Password<
/TD>
<
TD
style="
HEIGHT:25px"><
asp:TextBox
ID="txtPassword"
Runat="server" TextMode="Password">< /asp:TextBox><
/TD>< /TR> < TR>< TD style=" WIDTH:138px;
HEIGHT:25px">< /TD> < TD style=" HEIGHT:25px"> <
asp:Button id="btnSubmit" runat="server" Text="Ok"><
/asp:Button>< /TD> < /TR>< /TABLE>< /form><
/body>< /HTML>
8. Перейдите в окно Design и щелкните кнопкой мыши в любом месте формы,
чтобы вызвать обработчик события загрузки страницы.
9. Импортируйте следующие пространства имен
Imports
Imports System.Data.SqlClient
System.Data
10. Опишите строку подключения к базе данных
Dim strConnection As String
database=EmployeeInfo;
TRUSTED_CONNECTION=YES"
=
"server=(local);
11. Напишите следующий код загрузки web-страницы:
Private
Sub
Page_Load(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
MyBase.Load
Первоначальное удаление всех существующих элементов на странице и
последующего заполнения элемента управления DropDownList на Web-форме
названиями объектов, подлежащих загрузке. В нашем случае единственным
объектом является форма "Сотрудники".
ddlEntity.Items.Clear()
ddlEntity.Items.Add("Сотрудники")
End Sub
12. Создайте функцию Authenticate, которая будет получать регистрационное
имя (идентификатор) и пароль в качестве входных параметров и возвращать
идентификационный статус после проверки регистрационной информации,
хранящейся в таблице LoginDetails. Ниже приведен код функции:
Private Function Authenticate(ByVal strLoginID
String, ByVal strPassword As String) As Int32
As
Возвращает
0
1
регистрационное
2 - неправильный пароль
успешная
имя
не
регистрация
найдено
Dim cnn As New SqlConnection(strConnection)
Создадим объект Connection для выполнения соединения с базой данных
Dim strSQL As String
Опишем строку SQL параметризованного запроса, который должен найти
запись для заданного регистрационного имени (ID)
strSQL = "SELECT
LoginID=@LoginID"
*
FROM
LoginDetails
WHERE
Создадим командный объект для выполнения SQL-запроса к базе данных
Dim
cmd
As
cmd = New SqlCommand(strSQL, cnn)
SqlCommand
Необходимо добавить описание параметра: имя параметра и его значение
cmd.Parameters.Add("@LoginID", strLoginID.Trim)
Открываем соединение с базой данных
cnn.Open()
Создадим объект DataReader для хранения результатов выполнения запроса к
базе данных
Dim drLogin As SqlDataReader
Выполним запрос и сохраним результат поиска в объекте DataReader
drLogin = cmd.ExecuteReader
Проверим, была ли для данного регистрационного имени возращена запись
If drLogin.Read Then
Если регистрационное имя существует, необходимо проверить правильность
пароля
If (drLogin.GetString(1).Trim = strPassword.Trim)
Then
Return
(0)
'успешно
Else
Return
(2)'
неправильный
пароль
End
If
Else
Если не найдено записей для заданного регистрационного имени Return (1)'
регистрационное имя не найдено
End If
Закрыть считывающую программу и объект соединения
drLogin.Close()
cnn.Close()
End Function
13. Напишите код для кнопки OK.
Когда пользователь нажимает кнопку ОК, должна вызываться функция
Authenticate. При успешной регистрации эта страница направляет пользователя
на соответствующую страницу приложения. Однако при неудачной попытке
регистации для пользователя должно выводиться соответствующее сообщение с
помощью элемента управления lblMessage. Код обработки события Click кнопки
ОК приведен ниже:
Private
Sub
btnSubmit_Click(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
btnSubmit.Click
Объявим
переменную
для
хранения
статуса
идентификации
пользователя
Dim
AuthenticationStatus
As
Int32
Вызов
функции
Authenticate
с
параметрами,
введенными
пользователем
AuthenticationStatus
=
Authenticate(txtLoginID.Text.Trim,
txtPassword.Text.Trim)
Select
Case
(AuthenticationStatus)
Case
0'
Успешная
регистрация
lblMessage.Text
=
"Login
Successful"
проверка значения, выбранного в DrowDownList для
определения загружаемой формы, в нашем случае
единственная
форма
Сотрудники
Select
Case
ddlEntity.SelectedItem.Text
Case
"Сотрудники"
Направление пользователя к выбранной форме;
обратите внимание на полное имя формы с
расширением
.asp
Response.Redirect("WebForm1.aspx")
Для выбора из более обширного списка необходимо
добавить блоки Case для выбора созданных вами
других
форм
End
Select
Case 1' регистрационное имя (идентификатор) не
найдено
lblMessage.Text = "Invalid login ID. Please try again"
Case
2
'
неправильный
пароль
lblMessage.Text = "Invalid password.Please try again"
End
Select
Установить видимость lblMessage равной True
lblMessage.Visible
=
True
End Sub
На этом мы завершили разработку кода, который должен быть добавлен в файл
Web-формы WebForm2.asp.
14. Установите в Properties регистрационной формы WebForm2.asp свойство Set
As Start Page.
Примерный вид регистрационной формы после запуска показан на рис. 6.17.
Рис. 6.17. Регистрационная форма пользователя базы данных
Теперь нам осталось добавить несколько строк в процедуру загрузки формы
"Сотрудники" с тем, чтобы предотвратить переход, в эту форму минуя
регистрационную форму.
15. Измените код процедуры загрузки формы WebForm1.asp
Private
Sub
Page_Load(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
MyBase.Load
Проверка, не является ли это обращение повторным. Postback - это свойство
Web-формы. Значение свойства Postback - true, если страница была загружена
при ответе клиенту, в противном случае его значение false. Свойство Postback
используется для проверки, выполняется ли данный код в результате ответа или
в результате повторного обращения пользователя.
If Not Page.IsPostBack Then
Если пользователь попытается попасть на страницу, просто набрав URL в
адресной строке браузера, перенаправим его на страницу регистрации
If
Request.UrlReferrer
Is
Nothing
Response.Redirect("WebForm2.asp")
End
If Request.UrlReferrer.ToString.Length <
Request.UrlReferrer.ToString.Substring(14)
"WebForm2.asp"
Response.Redirect("WebForm2.asp")
End
Then
If
12 Or
<>
Then
If
ListDep.DataSource
ListDep.DataTextField
ListDep.DataValueField
ListDep.DataBind()
LoadData()
End
End Sub
=
=
LoadList()
"DepartmentName"
=
"ID"
If
Самостоятельно
Используя режим HTML-кода, выполните оформление регистрационной формы
по своему вкусу.
Протестируйте созданное приложение в различных режимах доступа, делая
осознанные ошибки при вводе login и password.
Задание 6. Выполнение вычислений на Webстраницах
Задача
Класс System.Web.UI.WebControls.DataGrid позволяет создавать элемент
управления DataGrid для вывода табличных данных. Этот элемент управления
идеально приспособлен для вывода, редактирования, сортировки данных из базы
данных. Необходимо научиться использовать DataGrid не только для
отображения, но и для выполнения вычислений над данными.
Решение
Заполнить элемент управления DataGrid данными из таблицы Employees базы
данных EmployeeInfo. Выполнить начисление премии каждому сотруднику на
основе данных столбца Salary и отобразить вычисленные данные в столбце
DataGrid.
Обсуждение
1. Создайте в рамках приложения EmployeeInfo еще одну Web-форму.
2. Разместите на форме элемент управления DataGrid. Ниже приведен пример
форматирования Web- формы в коде HTML, но не использовано цветовое
оформление, которое вы можете добавить сами.
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN"> < HTML>< HEAD>< title>WebForm3<
/title> < meta name="GENERATOR" content="Microsoft
Visual
Studio
.NET
7.1">
<
meta
name="CODE_LANGUAGE" content="Visual Basic .NET
7.1">
<
meta
name="vs_defaultClientScript"
content="JavaScript"> < meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5"><
/HEAD> < body MS_POSITIONING="GridLayout"> < form
id="Form1"
method="post"
runat="server">
<
asp:DataGrid id="DataGrid1" style="Z-INDEX: 101; LEFT:
16px; POSITION: absolute; TOP: 24px" runat="server"
Width="552px"
Height="240px"
AutoGenerateColumns="False"><
Columns>
<
asp:BoundColumn
DataField="FirstName"
HeaderText="FirstName">
<
HeaderStyle
HorizontalAlign="Center" Width="150px">< /HeaderStyle>
< ItemStyle HorizontalAlign="Center">< /ItemStyle><
/asp:BoundColumn>
<
asp:BoundColumn
DataField="LastName"
HeaderText="LastName">
<
HeaderStyle HorizontalAlign="Center" Width="150px"><
/HeaderStyle> < ItemStyle HorizontalAlign="Center"><
/ItemStyle>< /asp:BoundColumn> < asp:BoundColumn
DataField="DepartmentId" HeaderText="DepartmentId"> <
HeaderStyle HorizontalAlign="Center" Width="150px"><
/HeaderStyle> < ItemStyle HorizontalAlign="Center"><
/ItemStyle>< /asp:BoundColumn> < asp:BoundColumn
DataField="Salary" HeaderText="Salary"> < HeaderStyle
HorizontalAlign="Center" Width="150px">< /HeaderStyle>
< ItemStyle HorizontalAlign="Center">< /ItemStyle><
/asp:BoundColumn>
<
asp:BoundColumn
DataField="Премия"
HeaderText="Премия">
<
HeaderStyle HorizontalAlign="Center" Width="150px"><
/HeaderStyle> < ItemStyle HorizontalAlign="Center"><
/ItemStyle>< /asp:BoundColumn> < asp:BoundColumn
DataField="Итого" HeaderText="Итого"> < HeaderStyle
HorizontalAlign="Center" Width="150px">< /HeaderStyle>
< ItemStyle HorizontalAlign="Center">< /ItemStyle><
/asp:BoundColumn> < /Columns>< /asp:DataGrid><
/form>< /body>< /HTML>
3. Напишите процедуру загрузки формы
Imports
System.Data
Imports
System.Data.SqlClient
Dim strConnection As String = "server=(local);
database=EmployeeInfo;
TRUSTED_CONNECTION=YES"
Private
Sub
Page_Load(ByVal
sender
As
System.Object, ByVal e As System.EventArgs) Handles
MyBase.Load
If
Not
Page.IsPostBack
Then
Dim cnn
As
New
SqlConnection(strConnection)
Dim
ds
As
New
DataSet
Dim da As New SqlDataAdapter("SELECT * FROM
Employees",
cnn)
da.Fill(ds)
Создадим объект DataColumn для вычислений и
записи
в
DataGrid
Dim
dc
As
DataColumn
dc
=
New
DataColumn("Премия",
Type.GetType("System.Double"))
Вычисления сохраняются в свойстве Expression
объекта
DataColumn
dc.Expression
=
"Salary
*1.2"
Столбец необходимо добавить в коллекцию столбцов
таблицы
в
DataSet
ds.Tables(0).Columns.Add(dc)
dc
=
New
DataColumn("Итого",
Type.GetType("System.Double"))
dc.Expression
=
"Salary
+Премия"
ds.Tables(0).Columns.Add(dc)
DataGrid1.DataSource
=
ds.Tables(0).DefaultView
DataGrid1.DataBind()
End
If
End Sub
Окончательный вид DataGrid с вычисляемыми столбцами показан на рис. 6.18.
Рис. 6.18. Web-страница с вычислениями над столбцами базы данных
Самостоятельно
1. Оформите Web-страницу, используя HTML-код. Протестируйте полученное
приложение. Выполните другие вычисления, например, вычислите подоходный
налог на заработную плату и сумму, получаемую "на руки".
2. Добавьте полученную форму с вычислениями в список объектов доступа
регистрационной формы.
3. Измените процедуру загрузки страницы с вычислениями с целью устранения
несанкционированного доступа к странице без прохождения регистрации.