Материал: ЯнышеваСА_4716_ТекстВКР
Картинка-логотип создана с помощью «ImageButton» и при нажатии на неё будет открываться главная страница веб-приложения, код представлен в Листинге 1.
Листинг 1 – Код «ImageButton»
<td colspan="2" rowspan="2" style="text-align: center"> <asp:ImageButton ID="ImageButton1" runat="server"
Height="255px" ImageUrl="~/картинки/2021-06-04-22-05-41_1.jpg" OnClick="ImageButton1_Click" Width="253px" />
</td>
Все страницы сайта будут созданы на основе данного шаблона, что упростит работу, позволит избежать ошибок при переходе по ссылкам и создаст общий дизайн всего приложения. Код мастер-страницы представлен в Приложении 1.
Главная страница веб-приложения так же была создана на основе эталонной страницы, она продемонстрирована на рисунке 10. На ней располагается краткая информация об исследованиях, изображение также создана с помощью «ImageButton» и карта помещений лаборатории. При нажатии на одну из картинок открывается соответствующая страница (Грибы,
Бактерии или Вирусы). Подобный программный код продемонстрирован в листинге 1, а код страницы целиком продемонстрирован в Приложении 2.
26
Рисунок 10 – Главная страница
4.2.Подключение и работа с БД
При подключении БД могут быть использованы следующие источники:
Microsoft SQL Server, Oracle Database, Источник данных Microsoft ODBC,
Файл базы данных Microsoft Access, Файл базы данных Microsoft SQL Server
и другие [12].
Данные Биологической лаборатории хранятся в БД Microsoft Access,
будем подключать ее. Результат успешного подключения базы данных
Microsoft Access Лаборатория продемонстрирован на рисунке 11.
27
Рисунок 11 – Подключение БД База данных содержит 3 таблицы одинакового вида с разным набором
данных исследований десяти лабораторных мышей и окружающей среды. Названия и типы данных представлены в таблице 2, вид самой БД представлен на рисунке 12.
Таблица 2 – Типы данных
Имя поля |
Тип данных |
№ подопытного |
Числовой |
Ректальная температура |
Числовой |
ЧСС |
Числовой |
Двигательная активность |
Числовой |
Температура |
Числовой |
Влажность |
Числовой |
Давление |
Числовой |
Дата и время |
Дата и время |
Внешнее воздействие |
Длинный текст |
Примечание |
Длинный текст |
28
Рисунок 12 – База данных
4.2.1.Вывод таблиц На веб-сайт выведены 3 таблицы на соответствующие страницы. Создан
выпадающий список с номером подопытного, при выборе пользователем которого открывается соответствующая таблица с данными. Выпадающий список представлен на рисунке 13. Код передачи значения из выпадающего списка в элемент «GridView» представлен в листинге 2. Элемент GridView –
предназначенный для демонстрации данных в виде экранной таблицы,
состоящей из строк и столбцов.
29
Рисунок 13 – Выпадающий список
Листинг 2 – Элемент «GridView»
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
Session["IDA"] = this.DropDownList1.SelectedValue;
}
Из-за большого количества данных для удобства пользования включен постраничных просмотр, также работает сортировка при нажатии на название колонки данных. Код таблицы и строки подключения представлен в листинге
3.
Листинг 3 – Таблица и строка подключения
<asp:GridView ID="GridView1" runat="server" AllowSorting="True" AutoGenerateColumns="False" DataSourceID="SqlDataSource2" AllowPaging="True">
<Columns>
<asp:BoundField DataField="column1" HeaderText="№ подопытного" SortExpression="column1" />
<asp:BoundField DataField="Ректальная_температура" HeaderText="Ректальная температура" SortExpression="Ректальная_температура" />
<asp:BoundField DataField="ЧСС" HeaderText="ЧСС" SortExpression="ЧСС" />
<asp:BoundField DataField="Двигательная_активность" HeaderText="Двигательная активность" SortExpression="Двигательная_активность" />
<asp:BoundField DataField="Температура" HeaderText="Температура" SortExpression="Температура" />
30