ЛАБОРАТОРНАЯ РАБОТА № 7
СОЗДАНИЕ ЛЕНТОЧНЫХ И ТАБЛИЧНЫХ ФОРМ С СОРТИРОВКОЙ
И ФИЛЬТРАЦИЕЙ ДАННЫХ В СРЕДАХ SQL SERVER И
«MICROSOFT VISUAL STUDIO»
Цель лабораторной работы: освоить и получить компетенции и
навыки
создания
форм,
обеспечивающих
ведение
с
возможностью
фильтрации и сортировки данных в средах SQL SERVER и «Microsoft Visual
Studio».
7.1
Создание сложной ленточной формы
Продублируйте кнопки панели навигации, расположенной в верхней
части формы. Откройте проект и отобразите форму таблицы (используйте
обозреватель решений и конструктор форм, рис. 7.1).
Рис. 7.1 Окно обозревателя проектов
В нижней части формы расположите семь кнопок, как это показано на
рис. 7.2. Для оформления кнопок 1-7 используйте цвета шрифтов (ForeColor)
и фона (BackColor) в соответствии с вариантом задания лабораторной работы
№ 7.
184
Рис. 7.2 Расположение кнопок на форме и их настройка
Дважды щёлкните ЛКМ по каждой кнопке и в появившемся окне кода
формы в процедуре «button…_Click» наберите соответствующую команду
(см. табл. 7.1). Пример записей команд для таблицы «Преподаватели»
показан ниже:
private void button1_Click(object sender, EventArgs e)
{
преподавателиBindingSource.MoveFirst();
}
private void button2_Click(object sender, EventArgs e)
{
преподавателиBindingSource.MoveLast();
}
private void button3_Click(object sender, EventArgs e)
{
преподавателиBindingSource.MovePrevious();
}
private void button4_Click(object sender, EventArgs e)
{
преподавателиBindingSource.MoveNext();
185
}
private void button5_Click(object sender, EventArgs e)
{
преподавателиBindingSource.AddNew();
}
private void button6_Click(object sender, EventArgs e)
{
преподавателиBindingSource.RemoveCurrent();
}
private void button7_Click(object sender, EventArgs e)
{
//Проверка введённые данные на соответствие типам данных полей
Validate();
//Разрыв подключения таблицы с сервером
преподавателиBindingSource.EndEdit();
//Обновление базы данных на сервере
tableAdapterManager.UpdateAll(/*<имя базы
данныхDataSet>*/институтDataSet);
}
Таблица 7.1 Команды процедур
№
кнопки
1.
2
3
4
5
6
7
Команды
специальностиBindingSource.MoveFirst();
специальностиBindingSource.MoveLast();
специальностиBindingSource.MovePrevious();
специальностиBindingSource.MoveNext();
специальностиBindingSource.RemoveCurrent();
специальностиBindingSource.AddNew();
Validate();
<имя таблицы>BindingSource.EndEdit();
tableAdapterManager.UpdateAll(<имя базы
данных>DataSet);
Пояснение
Чтение первой записи
Чтение последней записи
Чтение предыдущей записи
Чтение следующей записи
Удаление текущей записи
Добавление новой записи
Сохранение изменений
Проведите отладку - проверьте выполнение операций с БД при
нажатии каждой кнопки.
186
7.2
Использование масок при вводе данных
Маски ввода данных снижают трудоемкость и уменьшают количество
ошибок при вводе данных. Для использования маски необходимо выбрать
поле на форме и пункт меню «Установить маску» (рис. 7.3).
Рис. 7.3 Использование маски ввода
После выбора пункта «Установка маски» на экране появится окно
ввода маски (рис. 7.4), которое позволяет выбрать готовое описание маски
либо задать специальное описание (пункт - «Phone number»).
Рис. 7.4 Настройка маски ввода для поля «Телефон»
Например, если вводить паспортные данные, которые отображаются
как: «<четыре цифры> <пробел> <шесть цифр>» описание маски будет
выглядеть следующим образом: «0000 000000».
187
В заключении, если это необходимо, подключим созданное поле ввода
по маске к соответствующему полу таблицы БД. Для этого с панели
«Источники данных» (DataSources) перетащите поле на поле ввода по маске,
расположенное справа от надписи названия поля в форме (рис. 7.5).
Рис. 7.5 Вставка значения поля из DataSet в элемент управления
7.3
Использование выпадающих списков
Применение выпадающих списков позволяет значительно сократить
трудоемкость и уменьшить количество ошибок при вводе и корректировке
данных. Пусть при вводе или корректировки значений поля можно
использовать множество известных значений. Это множество может быть
задано заранее пользователем, либо может быть являться значениями поля
какой-либо таблицы БД либо результатом выполнения какого- либо запроса.
В этом случае необходимо использовать выпадающий список.
Пусть имеется таблица № 1 и задано искомое поле, в которое будут
вводится значения. Необходимо создать выпадающий список, который будет
заполнен значениями поля из таблицы №2. При выборе значения в
выпадающем списке оно будет автоматически подставляться в искомое поле
таблицы №1.
188
Для этого необходимо:
1.
список
Поместить справа от надписи поля таблицы № 1 выпадающий
для
создания
выпадающего
списка
на
панели
элементов
воспользуйтесь кнопкой ComboBox (рис. 7.6).
Рис. 7.6 Замена исходного элемента на comboBox
2.
Подключим выпадающий список к полю таблицы 1 из таблицы
№ 2 и настроим заполнение списка значениями поля таблицы № 1 из
таблицы №2. Для этого необходимо выделить созданный выпадающий
список, отобразить меню «Задачи» и включить опцию «Использовать
элементы, привязанные к данным» («Use data bound items», рис. 7.7).
Рис. 7.7 Настройка параметров элемента управления comboBox
189
На панели «Задачи» в опции «Использовать элементы, привязанные к
данным» расположены следующие параметры:
• Data Source («Источник данных») - определяет таблицу №2 или
запрос, из которых берутся значения для заполнения списка;
• Display Member («Отобразить члена») - определяет поле таблицы № 2,
значениями которого заполняется список;
• Value Member («Член значений») - определяет значения, какого поля
таблицы 2 подставляются в связанное с выпадающим списком поле;
• Selected Value (выбранное значение) - определяет связанное с
выпадающим списком поле таблицы №1.
Для изменения параметров необходимо нажать кнопку внутри поля
параметра. Появится древовидная структура выбора источника данных (см.
рис. 7.8).
Рассмотрим пример. В этом случае зададим параметры следующим
образом:
●
Параметр «DataSource» задан как Преподаватели/BildingSources
●
Параметр «DataMember» задан как «Кафедра»;
●
Параметр «Value Member» задан как «Кафедра»;
●
Параметр
«Selected
Value»
задан
как
«преподавателиBindingSource - Кафедра»
После задания всех вышеперечисленных параметров панель действий
выпадающего списка примет вид (рис. 7.8):
190
Рис. 7.8 Отображение и источник данных в comboBox
После формирование выпадающего списка проверьте подстановку и
корректировку значений поля с использованием выпадающего списка.
7.4
Рассмотрим
Создание табличных форм
создание
табличной
формы
на
примере
формы,
отображающей таблицу «Кафедры». Добавим в проект новую форму (рис.
7.9) с именем «Список кафедр» и поместим на нее следующие объекты:
● Одна надпись (Label),
● пять кнопок (Button),
● выпадающий список (ComboBox),
● два переключателя (RadioButton).
● группирующую рамку (GroupBox) (см. рис. 7.10),
● список (ListBox),
Расположите объекты как показано на рисунке 7.11.
191
Рис. 7.9 Добавление новой формы
Рис. 7.10 Расположение элементов на форме
192
Рис. 7.11 Расположение всех необходимых элементов на форме
Добавим на форму таблицу для отображения данных (DataGridView) из
таблицы «Кафедры». Для этого на панели «Источники данных» (Data
Sources), нажмите кнопку, расположенную справа от таблицы «Кафедры». В
появившемся списке объектов для отображения всей таблицы выберите
«DataGridView» (рис. 7.12).
Рис. 7.12 Добавление таблицы DataGridView
193
Теперь перейдём к настройке свойств объектов. Начнём с настройки
свойств формы.
Задайте свойства формы следующим образом:
FormBorderStyle (Стиль границы формы): Fixed3D;
MaximizeBox (Кнопка развёртывания формы во весь экран):
MinimizeBox (Кнопка свёртывания формы на панель задач):
Text (введите текст надписи в заголовке формы, например,
False;
False;
«Кафедры»).
Задайте свойства надписей (Label1):
AutoSize (Авторазмер): False;
Text (Текст надписи – «Поле для сортировки»;
Font (Шрифт): Microsoft Sans Serif, размер 14;
ForeColor (цвет текста в соответствии с вариантом задания
лабораторной № 7 см. приложение 1 таблицу 1.17);
TextAlign (Выравнивание текста): MiddleCenter.
1.
Задайте надписи на кнопках как: «Сортировка», «Фильтр»,
«Показать все», «Найти» и «Закрыть» (соответственно для кнопок Button1,
Button2, Button3, Button4 и Button5). Для того чтобы нельзя было произвести
сортировку, не выбрав поля изначально заблокируем кнопку «Сортировка»
(Button1) (рис. 7.13).
194
Рис. 7.13 Блокировка перемещения элементов управления по форме
2.
У группирующей рамки задайте заголовок (свойство «Text»)
равным «Сортировка».
3.
У переключателей (объекты RadioButton1 и RadioButton2)
задайте надписи как «Сортировка по возрастанию» и «Сортировка по
убыванию», а у переключателя «Сортировка по возрастанию» (RadioButton1)
задайте свойство Checked («Включён») равное True («Истина»).
4.
Заполните список (ListBox1) значениями, представленными на
рисунке 7.14, а затем нажмите кнопку «Ok».
Рис. 7.14 Настройка списка listBox
5.
Настроим таблицу для отображения данных, удалив из неё
поля с кодами.
195
Выделите таблицу на форме и отобразите её меню действий, щёлкнув
ПКМ по кнопке, расположенной в верхнем правом углу таблицы. В меню
действий выберите пункт «Правка столбцов» («Edit columns», рис. 7.15).
Рис. 7.15 Правка столбцов в DataGridView
Появится окно настройки свойств полей таблицы «Правка столбцов»
(«Edit Columns, рис. 7.16).
Рис. 7.16 Окно настройки DataGridView
В окне из списка полей удалите поля «Телефон», выделив их и нажав
кнопку «Remove» (Удалить). Для закрытия окна редактирования полей, и
сохранения изменений нажмите кнопку «Ok».
196
Список полей примет вид, показанный на рисунке рис. 7.17.
Рис. 7.17 Список полей, после удаления одного поля
Настроим заполнение выпадающего списка поля «Кафедра» из
таблицы «Кафедры».
Для этого необходимо выделить созданный выпадающий список,
отобразить меню «Задачи» и включить опцию «Использовать элементы,
привязанные к данным» («Use Data Bound Items»).
В этом случае зададим параметры следующим образом:
Параметр «DataSource» задан как «кафедрыBildingSources»;
Параметр «DataMember» задан как «Кафедра»;
Остальные параметры оставьте без изменений (рис. 7.18).
Рис. 7.18 Отображение и источник данных в comboBox
197
Закройте окно действий выпадающего списка. На панели невидимых
объектов появится дополнительный объект связи «кафедрыBindingSource»,
предназначенный для заполнения выпадающего списка (рис 7.19).
Рис. 7.19 Список всех использующихся связей
После настройки всех вышеперечисленных свойств объектов новая
форма примет вид (рис. 7.20).
Рис. 7.20 Результат всех настроек
На этом мы заканчиваем настройку свойств объектов и переходим к
написанию кода обработчиков событий объектов.
Написания кода для разблокирования кнопки «Сортировка», при
выборе пункта списка (ListBox1). Для создания процедуры события дважды
щёлкните ЛКМ по списку. Появится процедура обработки события,
происходящего при выборе пункта списка (ListBox1_SelectedIndexChanged).
В процедуре наберите команду разблокировки кнопки «Сортировать»
(Button1):
private void listBox1_SelectedIndexChanged(object sender, EventArgs e)
{
button1.Enabled = true; //Разблокировка кнопки сортировать
}
198
Теперь перейдём к созданию кода сортирующего нашу таблицу в
зависимости от выбранного поля и порядка сортировки при нажатии кнопки
«Сортировка». Дважды щёлкните ЛКМ по кнопке «Сортировка». Появится
процедура «Button1_Click», выполняемая при щелчке ЛКМ по кнопке. В
процедуре наберите код, представленный на рисунке 7.21.
private void button1_Click(object sender, EventArgs e)
{
System.Windows.Forms.DataGridViewColumn
Col = dataGridViewTextBoxColumn1;
switch(listBox1.SelectedIndex)
{
case 0:
Col = dataGridViewTextBoxColumn1;
break;
case 1:
Col = dataGridViewTextBoxColumn2;
break;
}
if (radioButton1.Checked)
кафедрыDataGridView.Sort(Col,
System.ComponentModel.ListSortDirection.Ascending);
else
кафедрыDataGridView.Sort(Col,
System.ComponentModel.ListSortDirection.Descending);
}
199
Рис. 7.21 Отладка программы и проверка введенного кода
Рассмотрим введенный код более подробно:
Переменная
типа
Col
System.Windows.Forms.DataGridViewColumn
создается
для
хранения
имени выбранного столбца таблицы;
Затем следует оператор switch присваивающий переменной Col
имя выбранного столбца таблицы в зависимости от номера выбранного
пункта списка (ListBox1.SelectedIndex). Если выбран нулевой пункт списка,
то переменной Col присваивается значение DataGridViewTextBoxColumn3
(выбирается «Кафедра»), если первый, то – DataGridViewTextBoxColumn4
(выбирается «Специальность»). Нумерация пунктов списка начинается с
нуля, а нумерация столбцов - с единицы (см. табл. 7.2). Первый столбец
«ФИО»
носит
имя
DataGridViewTextBoxColumn3,
так
как
имя
DataGridViewTextBoxColumn1 имеет столбец № 1 номера строки таблицы.
Таблица 7.2. Символическое имя столбца таблицы
Номер
Наименование столбца
столбца
Символическое
имя
столбца Номер пункта
таблицы
списка
таблицы
1
Кафедра
DataGridViewTextBoxColumn1
200
2
Специальность
DataGridViewTextBoxColumn2
3
Заведующий
DataGridViewTextBoxColumn3
0
4
Количество
DataGridViewTextBoxColumn3
1
сотрудников
Оператор if выполняет следующую операцию (отметим, что имя
таблицы - «специалисты»):
если
включён
переключатель
«Сортировка
по
возрастанию»
(RadioButton1), то необходимо отсортировать таблицу по полю, заданному в
переменной
Col
по
возрастанию
(кафедрыDataGridView.Sort
(Col,
System.ComponentModel.ListSortDirection. Ascending)),
иначе
-
по
убыванию
(кафедрыDataGridView.Sort(Col,
System.ComponentModel.ListSortDirection. Descending)).
Выполнение команды «Фильтровать»
Рассмотрим обработку события нажатия кнопки «Фильтр» (Button2).
Дважды щёлкните по кнопке «Фильтр» и в процедуре обработки события
«Button2_Click» наберите код:
private void button2_Click(object sender, EventArgs e)
{
//Определение условий фильтрации
кафедрыBindingSource.Filter = "Кафедра=" + "'" + comboBox1.Text + "'";
}
Замечание: У объекта кафедрыBindingSource имеется текстовое
свойство
Filter,
которое
определяет
условие
фильтрации.
Условие
фильтрации имеет синтаксис:
<Имя поля> <Оператор>'<Значение>'.
В нашем случае значение поля «Фамилия» приравнивается (=) к
значению, выбранному в выпадающем списке (ComboBox1.Text).
201
Команда «Показать все»
Теперь перейдём к описанию процедуры «Показать всё», отменяющей
фильтрацию записей. Дважды щёлкните по кнопке, названной «Показать
все». Появится описание метода обработки события «Нажата кнопка 3»
(«Button3_Click»). В появившимся описании метода наберите команду:
кафедрыBindingSource.Filter = "";
В результате описание метода обработки события «Нажата клавиша
«Показать все»» должно выглядеть следующим образом:
private void button3_Click(object sender, EventArgs e)
{
кафедрыBindingSource.Filter = "";
}
Заметим, что если присвоить свойству «Filter» значение пустой строки,
то фильтрация не происходит, так как значение столбца строки таблицы не
сравниваются ни с чем, и строка таблицы будет всегда удовлетворять
условию отбора.
Поиск информации в таблице
Далее рассмотрим реализацию поиска информации в таблице. Дважды
щёлкните по кнопке «Найти». В появившейся процедуре обработки нажатия
кнопки «Button4_Click» наберите следующий код:
private void button4_Click(object sender, EventArgs e)
{
for (int i = 0; i < кафедрыDataGridView.ColumnCount; i++)
for (int j = 0; j < кафедрыDataGridView.RowCount; j++)
{
кафедрыDataGridView[i, j].Style.BackColor = Color.White;
202
кафедрыDataGridView[i, j].Style.ForeColor = Color.Black;
}
for (int i = 0; i < кафедрыDataGridView.ColumnCount; i++)
for (int j = 0; j < кафедрыDataGridView.RowCount - 1; j++)
if (кафедрыDataGridView[i, j].Value.ToString().Contains(comboBox1.Text))
{
кафедрыDataGridView[i, j].Style.BackColor = Color.AliceBlue;
кафедрыDataGridView[i, j].Style.ForeColor = Color.Blue;
}
}
Рассмотрим более подробно код выше приведённой процедуры. Данная
процедура состоит из двух частей:
Первый
цикл
«for»
перебирает
все
ячейки
таблицы
и
устанавливает в них белый цвет фона и чёрный цвет текста. Т.е., отменяет
результаты предыдущего поиска;
Второй блок «for» перебирает все ячейки таблицы и, если они
содержат текст, введённый в поле ввода (comboBox1.Text), то устанавливает
в них голубой цвет фона и синий цвет текста, чем выделяет искомые ячейки.
Наконец рассмотрим код для кнопки «Закрыть». Дважды щёлкните
ЛКМ по этой кнопке и в появившейся процедуре «Button5_Click» наберите
команду «this.Close()», закрывающую выше рассматриваемую форму:
private void button5_Click(object sender, EventArgs e)
{
this.Close();
}
В заключение создадим кнопку на ленточной форме, отображающей
таблицу «Кафедры», для отображения соответствующей табличной формы.
Откройте ленточную форму для таблицы «Преподаватели» (Form2) и
поместите на кнопку с именем «Таблица», как это показано на рисунке рис.
7.22.
203
Рис. 7.22 Финальный этап разработки интерфейса
Подключим к кнопке «Таблица «Кафедры»» созданную ранее
табличную форму (Form3). Для этого дважды щёлкните ЛКМ по кнопке
«Таблица «Кафедры»» и в появившейся процедуре «Button8_Click» наберите
текст:
private void button8_Click(object sender, EventArgs e)
{
Form3 form3 = new Form3();
form3.Show();
}
Теперь проверим работоспособность созданной табличной формы.
Запустите проект и на главной кнопочной форме нажмите кнопку «Таблица
«Преподаватели»». На появившейся ленточной форме, нажмите кнопку
«Таблица». Появится новая табличная форма.
Проверьте, как работает поиск, фильтрация и сортировка записей в
таблице, нажимая на соответствующие кнопки.
204
7.5 Задание и порядок выполнения лабораторной работы №7
Используя проект, построенный на предыдущей лабораторной работе в
Visual Studio с именем «SQL_XXXX_YYYY», где XXXX - номер группы, а
YYYY – фамилия студента, набранная кириллицей и, в соответствии с
вариантом задания лабораторной работы № 7 (см. приложение 1 таблицу
П1.17), создать ленточную и табличную формы, обеспечивающие ведение
БД с возможностью фильтрации и сортировки данных в средах SQL SERVER
и «Microsoft Visual Studio».
Порядок выполнения лабораторной работы №7:
1.
Используя варианты лабораторных работ № 6 и № 7 создать
ленточную форму для таблицы «Расписание» (см. п. 7.1). При раскраске
графических объектов использовать вариант задания лабораторной работы №
7, см. приложение 1 таблицу П1.17).
2.
Для одного любого из числовых полей в созданной форме (для
таблицы «Расписание») создать маску ввода данных (см. п. 7.2).
3.
В соответствии с вариантом задания лабораторный работы № 6 в
таблице «Расписание» для полей «Наименование станции» либо «Номер
поезда» создать выпадающий список» (см. п. 7.3).
4.
Создать табличную форму для таблицы «Расписание» (см. п. 7.4).
5.
Подготовить отчет о выполнении лабораторной работы(см. п.7.6).
6.
Пройти тестирование, ответить на контрольные вопросы (см.
п.7.7), защитить отчет.
7.6. Оформление отчета лабораторной работы.
В отчет включить: титульный лист, подготовленное задание в
соответствии с номером варианта, результаты выполнения этапов 1-4 с
документальным
подтверждением
в
виде
«снимков»
экранов
с
205
разработанными формами и результатами выполнения сортировки и
фильтрации с текстовым пояснением.
7.7. Вопросы к лабораторной работе № 7
Для защиты отчета лабораторной работы необходимо ответить на
следующие вопросы:
1.
Поясните процесс создания сложной ленточной формы
2.
Поясните процесс использования масок при вводе данных
3.
Поясните процесс создания табличных форм
4.
Поясните назначение Использования выпадающих списков
5.
Поясните назначение группирующей рамки.
6.
Поясните назначение переключателей.
7.
Поясните назначение ListBox.
8.
Поясните назначение Edit columns.
9.
Поясните назначение Remove.
10.
Опишите технологию Use Data Bound Items.
206