|
Элемент управления
ID
ID
tb_ID
Название
tb_Nazvanie
Цена
tb_Cena
Количество
tb_Kol
Год выпуска
tb_God
Страна
ddl_Strana
Описание
tb_Opisanie
Для удобства чтения кода идентификаторы должны быть осмысленными,
в них нельзя использовать пробелы, вместо них используйте нижние
подчёркивания. Также рекомендуется, чтобы в начале идентификатора было
сокращённое название элемента управления. Например, для элемента
управления TextBox сокращённым названием будет tb_, для элемента
управления DropDownList сокращённым названием будет ddl_.
Для отображения списка товаров используйте элемент управления
GridView, находящийся в секции
Данные
палитры элементов управления.
Сразу после его добавления на страницу он будет выглядеть как на рис.
ниже.
Чтобы связать его с данными из базы, нажмите на кнопке в правом
верхнем углу элемента управления, в открывшемся окне
Задачи GridView
раскройте список
Выбрать источник данных
и нажмите на пункте
Новый
источник данных
.
В открывшемся окне
Мастер конфигурации источника данных
выберите
тип
База данных
и нажмите на кнопку
ОК
В следующем окне из раскрывающегося списка выберите базу данных
retro_db.mdf
В следующем окне ничего не меняйте, просто нажмите на кнопку «Далее»
В следующем окне отметьте флажками поля, которые необходимо
отобразить в таблице (ID,Nazvanie,Cena), нажмите на кнопку «Далее».
В последнем окне нажмите на кнопку «Готово»
Таблица (GridView) примет вид, как на рис. Также на странице появится
объект SqlDataSource – он содержит в себе все SQL-запросы, необходимые
для работы таблицы. Элемент SqlDataSource является невидимым – то есть
отображается только в Visual Studio, а в браузере не виден.
Сделайте, чтобы заголовки столбцов отображались русскими буквами.
Для этого выделите таблицу с помощью мыши, в правом верхнем углу
появится кнопка, по нажатии на которой откроется окно «Задачи GridView»,
в котором нужно нажать на пункте «Правка столбцов»
В окне «Поля» в секции «Выбранные поля» поочерёдно нажимайте на
названия столбцов и изменяйте их названия на русские внутри свойства
HeaderText.
Добавьте в каждую строку таблицы гиперссылки «Редактировать» и
«Удалить». В окне «Задачи GridView» выберите пункт «Добавить новый
столбец»
Для создания гиперссылки «Редактировать» выберите тип поля
CommandField
, тип кнопки
Link
, отметьте флажком пункт
Выбрать
, нажмите
на кнопку
ОК
Перейдите в окно «Поля» (Задачи GridView > Правка столбцов), в списке
«Выбранные поля» выделите поле «Выбор» и установите его свойство
SelectText
в значение
Редактировать
Для создания гиперссылки «Удалить» также выполните команду
Задачи
GridVIew > Добавить новый столбец
, в окне «Добавить поле» выберите тип
поля
CommandField
, тип кнопки
Link
, отметьте флажком пункт
Удалить
,
нажмите на кнопку
ОК
Для того, чтобы при нажатии на гиперссылку «Удалить» происходило
удаление записи, в свойствах SqlDataSource1 пропишите соответствующий
SQL-запрос (DeleteQuery). Для этого нажмите на кнопку «…» в
соответствующей строке
Откроется окно «Редактор команд и параметров», в котором нажмите на
кнопку «Построитель запросов».
В открывшемся окне «Добавить таблицу» выделите таблицу tovary,
нажмите на кнопку «Добавить», далее на кнопку «Закрыть».
В окне конструктора запросов сконструируйте запрос на удаление. Для
этого в табличной части в графе «Столбец» укажите поле Id, а в графу
«Фильтр» впишите =@Param1. Таким образом вы зададите критерий выбора
той записи, которую нужно удалить («удалить запись, у которой Id равен
указанному параметру»). В результате в текстовом поле ниже вы увидите
автоматически сгенерированный SQL-запрос. Нажмите на кнопку ОК.
Вы будете возвращены в окно «Редактор команд и параметров», где
увидите только что созданный SQL-запрос. Окно «Редактор команд и
параметров» позволяет связать параметры SQL-запроса со значениями в
некоторых элементах управления на форме.
Нажмите на кнопку «Обновить параметры», в результате в списке
«Параметры» появится прописанный в SQL-запросе параметр Param1.
Выделите его мышью, и задайте для него в качестве источника Control, в
графе ControlID выберите GridView1. В результате идентификатор удаляемой
записи (параметр @Param1) будет определён на основе того, в какой строке
таблицы GridView была нажата кнопка «Удалить». Нажмите на кнопку
ОК
.
Далее необходимо настроить работу с данными для формы создания
нового или редактирования существующего товара. Добавьте на страницу
ещё один SqlDataSource (возьмите его на панели элементов в секции
Данные
), для удобства разместите его рядом с формой (см.рис).
Терперь внутри этого SqlDataSource необходимо определить запросы для
подгрузки в форму редактируемого товара (SelectQuery), добавления нового
товара (InsertQuery) и обновления существующего товара (UpdateQuery).
Здесь же выполнить привязку полей формы к полям таблицы базы данных
(связав поля формы с параметрами запросов).
Выделите мышью SqlDataSource2, нажмите на появившуюся в правом
верхнем углу кнопку, в открывшемся окне «Задачи SqlDataSource» нажать на
кнопку
Настроить источник данных
Откроется окно «Настроить источник данных» В первом окне мастера
выберите строку соединения
ConnectionString
Во втором окне мастера укажите поля таблицы базы данных, из которых
требуется постановка данных в форму (в нашем случае это все поля
таблицы). Нажмите на кнопку Далее.
В последнем окне мастера нажмите на кнопку Готово
Теперь необходимо задать условие отбора извлекаемых данных. Для
этого выделите SqlDataSource мышью, в окне свойств найдите свойство
SelectQuery, и нажмите на кнопку «…» в соответствующей строке. В
соответствии со скриншотами ниже выполните настройку запроса.
В соответствии со скриншотами ниже настройте SQL-запрос на
Do'stlaringiz bilan baham: |
