Поделиться через


Добавление кнопок и ответов на них к GridView (VB)

Скотт Митчелл

Загрузить PDF-файл

В этом руководстве мы рассмотрим, как добавить пользовательские кнопки как в шаблон, так и в поля элемента управления GridView или DetailsView. В частности, мы создадим интерфейс с FormView, который позволяет пользователю просматривать поставщиков.

Введение

Хотя многие сценарии создания отчетов предполагают доступ только для чтения к данным отчета, нередко отчеты включают возможность выполнения действий на основе отображаемых данных. Обычно это включает добавление элемента управления Button, LinkButton или ImageButton Web с каждой записью, отображаемой в отчете, которая при щелчке вызывает обратную передачу и вызывает код на стороне сервера. Наиболее распространенным примером является изменение и удаление данных по записям. На самом деле, как мы видели, начиная с руководства Общие сведения о вставке, обновлении и удалении данных , редактирование и удаление настолько распространены, что элементы управления GridView, DetailsView и FormView могут поддерживать такие функции без необходимости написания одной строки кода.

Помимо кнопок "Изменить" и "Удалить", элементы управления GridView, DetailsView и FormView также могут включать элементы управления Button, LinkButtons или ImageButtons, которые при щелчке выполняют пользовательскую логику на стороне сервера. В этом руководстве мы рассмотрим, как добавить пользовательские кнопки как в шаблон, так и в поля элемента управления GridView или DetailsView. В частности, мы создадим интерфейс с FormView, который позволяет пользователю просматривать поставщиков. Для конкретного поставщика в FormView будут отображаться сведения о поставщике вместе с элементом управления "Кнопка", который при щелчке помечает все связанные с ним продукты как неподдерживаемые. Кроме того, в GridView перечислены продукты, предоставляемые выбранным поставщиком, с каждой строкой, содержащей кнопки повышения цены и скидки, которые при нажатии кнопки повышают или уменьшают значение продукта UnitPrice на 10 % (см. рис. 1).

FormView и GridView содержат кнопки, выполняющие пользовательские действия

Рис. 1. Элементы FormView и GridView содержат кнопки, выполняющие пользовательские действия (щелкните для просмотра полноразмерного изображения)

Шаг 1. Добавление веб-страниц учебника по кнопкам

Прежде чем мы рассмотрим, как добавить пользовательские кнопки, сначала уделим время созданию ASP.NET страниц в проекте веб-сайта, который понадобится для работы с этим руководством. Начните с добавления новой папки с именем CustomButtons. Затем добавьте следующие две страницы ASP.NET в папку, чтобы связать каждую страницу со страницей Site.master master:

  • Default.aspx
  • CustomButtons.aspx

Добавление страниц ASP.NET для руководств по пользовательским Buttons-Related

Рис. 2. Добавление страниц ASP.NET для руководств по пользовательским Buttons-Related

Как и в других папках, Default.aspx в папке CustomButtons будет отображаться список учебников в своем разделе. Помните, что SectionLevelTutorialListing.ascx пользовательский элемент управления предоставляет эту функцию. Поэтому добавьте этот пользовательский элемент управления в , Default.aspx перетащив его из Обозреватель решений в режим конструктора страницы.

Добавьте пользовательский элемент управления SectionLevelTutorialListing.ascx в Default.aspx

Рис. 3. Добавление пользовательского SectionLevelTutorialListing.ascx элемента управления в Default.aspx (щелкните для просмотра полноразмерного изображения)

Наконец, добавьте страницы в качестве записей в Web.sitemap файл. В частности, добавьте следующую разметку после разбиения по страницам и сортировки <siteMapNode>:

<siteMapNode
    title="Adding Custom Buttons"
    description="Samples of Reports that Include Buttons for Performing
                  Server-Side Actions"
    url="~/CustomButtons/Default.aspx">
    <siteMapNode
        title="Using ButtonFields and Buttons in Templates"
        description="Examines how to add custom Buttons, LinkButtons,
                      or ImageButtons as ButtonFields or within templates."
        url="~/CustomButtons/CustomButtons.aspx" />
</siteMapNode>

После обновления Web.sitemapпросмотрите веб-сайт учебников в браузере. Меню слева теперь содержит элементы для редактирования, вставки и удаления учебников.

Схема сайта теперь включает запись для руководства по пользовательским кнопкам

Рис. 4. Схема сайта теперь включает запись для руководства по пользовательским кнопкам

Шаг 2. Добавление FormView, Списки поставщиков

Давайте приступим к работе с этим руководством, добавив FormView, в который перечислены поставщики. Как описано во введении, этот FormView позволит пользователю просматривать поставщиков, отображая продукты, предоставленные поставщиком в GridView. Кроме того, этот FormView будет включать кнопку , которая при нажатии помечает все продукты поставщика как неподдерживаемые. Прежде чем добавить пользовательскую кнопку в FormView, сначала создадим FormView, чтобы он отображал сведения о поставщике.

Начните с открытия страницы CustomButtons.aspx в папке CustomButtons . Добавьте FormView на страницу, перетащив его с панели элементов на Designer и присвоив свойству ID значение Suppliers. В смарт-теге FormView создайте объект ObjectDataSource с именем SuppliersDataSource.

Создание объекта ObjectDataSource с именем SuppliersDataSource

Рис. 5. Создание объекта ObjectDataSource с именем SuppliersDataSource (щелкните для просмотра полноразмерного изображения)

Настройте этот новый объект ObjectDataSource таким образом, чтобы он запрашивал метод SuppliersBLL класса GetSuppliers() (см. рис. 6). Так как этот FormView не предоставляет интерфейс для обновления сведений о поставщике, выберите параметр (Нет) в раскрывающемся списке на вкладке ОБНОВЛЕНИЕ.

Настройка источника данных для использования метода GetSuppliers() класса SuppliersBLL

Рис. 6. Настройка источника данных для использования SuppliersBLL метода Класса GetSuppliers() (щелкните для просмотра полноразмерного изображения)

После настройки ObjectDataSource Visual Studio создаст InsertItemTemplate, EditItemTemplateи ItemTemplate для FormView. InsertItemTemplate Удалите и EditItemTemplate измените , ItemTemplate чтобы отображались только название компании и номер телефона поставщика. Наконец, включите поддержку разбиения по страницам для FormView, установив флажок Включить разбиение по страницам в смарт-теге (или задав для его AllowPaging свойства значение True). После этих изменений декларативная разметка страницы должна выглядеть примерно так:

<asp:FormView ID="Suppliers" runat="server" DataKeyNames="SupplierID"
    DataSourceID="SuppliersDataSource" EnableViewState="False" AllowPaging="True">
    <ItemTemplate>
        <h3>
            <asp:Label ID="CompanyName" runat="server"
                Text='<%# Bind("CompanyName") %>' />
        </h3>
        <b>Phone:</b>
        <asp:Label ID="PhoneLabel" runat="server" Text='<%# Bind("Phone") %>' />
    </ItemTemplate>
</asp:FormView>
<asp:ObjectDataSource ID="SuppliersDataSource" runat="server"
    OldValuesParameterFormatString="original_{0}"
    SelectMethod="GetSuppliers" TypeName="SuppliersBLL">
</asp:ObjectDataSource>

На рисунке 7 показана страница CustomButtons.aspx при просмотре в браузере.

FormView Списки поля CompanyName и Phone от выбранного поставщика

Рис. 7. FormView Списки CompanyName поля и Phone от выбранного поставщика (щелкните, чтобы просмотреть полноразмерное изображение)

Шаг 3. Добавление GridView, Списки продуктов выбранного поставщика

Прежде чем добавить кнопку "Отменить все продукты" в шаблон FormView, сначала добавим gridView под FormView, который перечисляет продукты, предоставляемые выбранным поставщиком. Для этого добавьте GridView на страницу, задайте для его ID свойства SuppliersProductsзначение и добавьте новый объект ObjectDataSource с именем SuppliersProductsDataSource.

Создание объекта ObjectDataSource с именем SuppliersProductsDataSource

Рис. 8. Создание объекта ObjectDataSource с именем SuppliersProductsDataSource (щелкните для просмотра полноразмерного изображения)

Настройте этот объект ObjectDataSource для использования метода класса GetProductsBySupplierID(supplierID) ProductsBLL (см. рис. 9). Хотя gridView позволяет скорректировать цену продукта, он не будет использовать встроенные функции редактирования или удаления из GridView. Таким образом, можно задать для раскрывающегося списка значение (Нет) для вкладок UPDATE, INSERT и DELETE объектов ObjectDataSource.

Настройка источника данных для использования метода GetProductsBySupplierID(supplierID) класса ProductsBLL

Рис. 9. Настройка источника данных для использования ProductsBLL метода Classs GetProductsBySupplierID(supplierID) (щелкните для просмотра полноразмерного изображения)

GetProductsBySupplierID(supplierID) Так как метод принимает входной параметр, мастер ObjectDataSource запрашивает источник значения этого параметра. Чтобы передать значение из FormView, задайте в SupplierID раскрывающемся списке Источник параметров значение Control, а в раскрывающемся списке ControlID — Suppliers значение (идентификатор FormView, созданного на шаге 2).

Укажите, что параметр supplierID должен поступать из элемента управления

Рис. 10. Указание на supplierID то, что параметр должен поступать из Suppliers элемента управления FormView (щелкните для просмотра полноразмерного изображения)

После завершения работы мастера ObjectDataSource GridView будет содержать BoundField или CheckBoxField для каждого поля данных продукта. Обрежем его, чтобы отобразить только ProductName и UnitPrice BoundFields вместе с Discontinued CheckBoxField. Кроме того, отформатируйте UnitPrice BoundField таким образом, чтобы его текст был отформатирован как валюта. Декларативная разметка GridView и SuppliersProductsDataSource ObjectDataSource должна выглядеть примерно так:

<asp:GridView ID="SuppliersProducts" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="SuppliersProductsDataSource"
    EnableViewState="False" runat="server">
    <Columns>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
            SortExpression="ProductName" />
        <asp:BoundField DataField="UnitPrice" HeaderText="Price"
            SortExpression="UnitPrice" DataFormatString="{0:C}"
            HtmlEncode="False" />
        <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued"
            SortExpression="Discontinued" />
    </Columns>
</asp:GridView>
<asp:ObjectDataSource ID="SuppliersProductsDataSource" runat="server"
    OldValuesParameterFormatString="original_{0}"
    SelectMethod="GetProductsBySupplierID" TypeName="ProductsBLL">
    <SelectParameters>
        <asp:ControlParameter ControlID="Suppliers" Name="supplierID"
            PropertyName="SelectedValue" Type="Int32" />
    </SelectParameters>
</asp:ObjectDataSource>

На этом этапе в нашем руководстве отображается отчет master/details, позволяющий пользователю выбрать поставщика из FormView вверху и просмотреть продукты, предоставляемые этим поставщиком, с помощью GridView внизу. На рисунке 11 показан снимок экрана этой страницы при выборе поставщика Tokyo Traders из FormView.

Продукты выбранного поставщика отображаются в GridView

Рис. 11. Продукты выбранного поставщика отображаются в GridView (щелкните, чтобы просмотреть полноразмерное изображение)

Шаг 4. Создание методов DAL и BLL для прекращения поддержки всех продуктов для поставщика

Перед добавлением кнопки в FormView, которая при нажатии прекращает работу всех продуктов поставщика, необходимо сначала добавить метод в DAL и BLL, который выполняет это действие. В частности, этот метод будет называться DiscontinueAllProductsForSupplier(supplierID). При нажатии кнопки FormView мы будем вызывать этот метод на уровне бизнес-логики, передавая выбранные поставщики SupplierID. Затем BLL вызовет соответствующий UPDATE метод уровня доступа к данным, который выдаст инструкцию для базы данных, которая прекращает работу с продуктами указанного поставщика.

Как и в предыдущих руководствах, мы будем использовать подход снизу вверх, начиная с создания метода DAL, затем метода BLL и, наконец, реализуя функциональные возможности на странице ASP.NET. Откройте типизированный Northwind.xsd набор данных в папке App_Code/DAL и добавьте новый метод в ProductsTableAdapter (щелкните правой ProductsTableAdapter кнопкой мыши и выберите команду Добавить запрос). При этом откроется мастер настройки запросов TableAdapter, который поможет нам добавить новый метод. Начните с указания, что наш метод DAL будет использовать нерегламентированную инструкцию SQL.

Создание метода DAL с помощью нерегламентированной инструкции SQL

Рис. 12. Создание метода DAL с помощью нерегламентированной инструкции SQL (щелкните для просмотра полноразмерного изображения)

Затем мастер запрашивает тип создаваемого запроса. DiscontinueAllProductsForSupplier(supplierID) Так как методу потребуется обновить таблицу Products базы данных, задав Discontinued для поля значение 1 для всех продуктов, предоставляемых указанным supplierID, необходимо создать запрос, обновляющий данные.

Выбор типа запроса UPDATE

Рис. 13. Выбор типа запроса UPDATE (щелкните для просмотра полноразмерного изображения)

На следующем экране мастера отображается существующая UPDATE инструкция TableAdapter, которая обновляет каждое из полей, определенных Products в таблице DataTable. Замените этот текст запроса следующим оператором:

UPDATE [Products] SET
   Discontinued = 1
WHERE SupplierID = @SupplierID

После ввода этого запроса и нажатия кнопки Далее на последнем экране мастера будет запрашиваться имя нового метода use DiscontinueAllProductsForSupplier. Завершите работу мастера, нажав кнопку Готово. После возвращения к dataSet Designer вы увидите ProductsTableAdapter новый метод в с именем DiscontinueAllProductsForSupplier(@SupplierID).

Назовите новый метод DAL DiscontinueAllProductsForSupplier

Рис. 14. Имя нового метода DiscontinueAllProductsForSupplier DAL (щелкните для просмотра полноразмерного изображения)

С помощью метода, созданного DiscontinueAllProductsForSupplier(supplierID) на уровне доступа к данным, наша следующая задача — создать DiscontinueAllProductsForSupplier(supplierID) метод на уровне бизнес-логики. Для этого откройте ProductsBLL файл класса и добавьте следующее:

Public Function DiscontinueAllProductsForSupplier(supplierID As Integer) As Integer
    Return Adapter.DiscontinueAllProductsForSupplier(supplierID)
End Function

Этот метод просто вызывает DiscontinueAllProductsForSupplier(supplierID) метод в DAL, передавая предоставленное supplierID значение параметра. Если существуют какие-либо бизнес-правила, которые разрешают прекращение использования только продукции поставщика при определенных обстоятельствах, эти правила должны быть реализованы здесь, в BLL.

Примечание

UpdateProduct В отличие от перегрузок в ProductsBLL классе, сигнатура DiscontinueAllProductsForSupplier(supplierID) метода не включает DataObjectMethodAttribute атрибут (<System.ComponentModel.DataObjectMethodAttribute(System.ComponentModel.DataObjectMethodType.Update, Boolean)>). Это исключает DiscontinueAllProductsForSupplier(supplierID) использование метода из раскрывающегося списка мастера настройки источника данных ObjectDataSource на вкладке UPDATE. Я опустил этот атрибут, так как мы будем вызывать DiscontinueAllProductsForSupplier(supplierID) метод непосредственно из обработчика событий на странице ASP.NET.

Шаг 5. Добавление кнопки "Отменить все продукты" в FormView

DiscontinueAllProductsForSupplier(supplierID) После завершения метода в BLL и DAL последний шаг для добавления возможности прекращения поддержки всех продуктов для выбранного поставщика заключается в добавлении веб-элемента управления Button в formView s ItemTemplate. Давайте добавим такую кнопку под номером телефона поставщика с текстом кнопки Прекратить все продукты и значением IDDiscontinueAllProductsForSupplierсвойства . Этот веб-элемент управления Button можно добавить через Designer, щелкнув ссылку Изменить шаблоны в смарт-теге FormView (см. рис. 15) или непосредственно с помощью декларативного синтаксиса.

Добавление веб-элемента управления

Рис. 15. Добавление веб-элемента управления Кнопки "Отменить все продукты" в FormView (ItemTemplateщелкните для просмотра полноразмерного изображения)

При нажатии кнопки пользователем, посещающим страницу, происходит обратная связь и возникает событие FormViewItemCommand. Чтобы выполнить пользовательский код в ответ на нажатие кнопки, можно создать обработчик событий для этого события. Однако учтите, что ItemCommand событие возникает при каждом щелчке элемента управления Button, LinkButton или ImageButton Web в FormView. Это означает, что при переходе пользователя с одной страницы на другую в FormView возникает событие; ItemCommand то же самое происходит, когда пользователь нажимает кнопку Создать, Изменить или Удалить в FormView, поддерживающем вставку, обновление или удаление.

ItemCommand Так как срабатывает независимо от того, какая кнопка нажата, в обработчике событий нам нужен способ определить, была ли нажата кнопка "Прекратить все продукты" или была ли она какой-либо другой кнопкой. Для этого можно присвоить свойству элемента управления CommandName Button Web значение, определяющее значение. При нажатии кнопки это CommandName значение передается в ItemCommand обработчик событий, что позволяет определить, была ли нажата кнопка "Прекратить все продукты". Присвойте свойству Кнопки "Прекратить все продукты" CommandName значение DiscontinueProducts .

Наконец, давайте воспользуемся диалоговым окном подтверждения на стороне клиента, чтобы убедиться, что пользователь действительно хочет прекратить работу с выбранными продуктами поставщика. Как мы видели в руководстве Добавление подтверждения Client-Side при удалении , это можно сделать с помощью JavaScript. В частности, задайте для свойства OnClientClick веб-элемента управления Button значение. return confirm('This will mark _all_ of this supplier\'s products as discontinued. Are you certain you want to do this?');

После внесения этих изменений декларативный синтаксис FormView должен выглядеть следующим образом:

<asp:FormView ID="Suppliers" runat="server" DataKeyNames="SupplierID"
    DataSourceID="SuppliersDataSource" EnableViewState="False"
    AllowPaging="True">
    <ItemTemplate>
        <h3><asp:Label ID="CompanyName" runat="server"
            Text='<%# Bind("CompanyName") %>'></asp:Label></h3>
        <b>Phone:</b>
        <asp:Label ID="PhoneLabel" runat="server" Text='<%# Bind("Phone") %>' />
        <br />
        <asp:Button ID="DiscontinueAllProductsForSupplier" runat="server"
            CommandName="DiscontinueProducts" Text="Discontinue All Products"
            OnClientClick="return confirm('This will mark _all_ of this supplier\'s
                products as discontinued. Are you certain you want to do this?');" />
    </ItemTemplate>
</asp:FormView>

Затем создайте обработчик событий для события FormView ItemCommand . В этом обработчике событий необходимо сначала определить, была ли нажата кнопка Прекратить все продукты. Если это так, мы хотим создать экземпляр ProductsBLL класса и вызвать его DiscontinueAllProductsForSupplier(supplierID) метод, передав SupplierID в выбранном FormView:

Protected Sub Suppliers_ItemCommand(sender As Object, e As FormViewCommandEventArgs) _
    Handles Suppliers.ItemCommand
    If e.CommandName.CompareTo("DiscontinueProducts") = 0 Then
        ' The "Discontinue All Products" Button was clicked.
        ' Invoke the ProductsBLL.DiscontinueAllProductsForSupplier(supplierID) method
        ' First, get the SupplierID selected in the FormView
        Dim supplierID As Integer = CType(Suppliers.SelectedValue, Integer)
        ' Next, create an instance of the ProductsBLL class
        Dim productInfo As New ProductsBLL()
        ' Finally, invoke the DiscontinueAllProductsForSupplier(supplierID) method
        productInfo.DiscontinueAllProductsForSupplier(supplierID)
    End If
End Sub

Обратите внимание, что доступ к объекту SupplierID текущего выбранного поставщика в FormView можно получить с помощью свойства FormViewSelectedValue. Свойство SelectedValue возвращает первое значение ключа данных для записи, отображаемой в FormView. Свойство FormViewDataKeyNames, указывающее поля данных, из которых извлекаются значения ключа данных, было автоматически установлено SupplierID в Visual Studio при привязке ObjectDataSource к FormView на шаге 2.

Создав ItemCommand обработчик событий, проверьте страницу. Перейдите к поставщику Quesos 'Las Cabras' (это пятый поставщик в FormView для меня). Этот поставщик предоставляет два продукта, Queso Cabrales и Queso Manchego La Pastora, оба из которых не прекращены.

Представьте себе, что Коперива де Кесос "Лас Кабрас" вышел из бизнеса и, следовательно, его продукты должны быть прекращены. Нажмите кнопку Прекратить все продукты. Откроется диалоговое окно подтверждения на стороне клиента (см. рис. 16).

Кооперива де Кесос Лас Кабрас поставляет два активных продукта

Рис. 16. Совместная работа Quesos Las Cabras Поставляет два активных продукта (щелкните для просмотра полноразмерного изображения)

Если нажать кнопку ОК в диалоговом окне подтверждения на стороне клиента, отправка формы продолжится, что приведет к обратной отправке, в которой срабатывает событие FormView ItemCommand . Созданный обработчик событий будет выполняться, вызывая DiscontinueAllProductsForSupplier(supplierID) метод и прекращая использование продуктов Queso Cabrales и Queso Manchego La Pastora.

Если вы отключили состояние представления GridView, gridView выполняется отскок к базовому хранилищу данных при каждой обратной отправке и, следовательно, будет немедленно обновлен, чтобы отразить, что эти два продукта теперь не поддерживаются (см. рис. 17). Однако если состояние представления в GridView не отключено, необходимо вручную повторно привязать данные к GridView после внесения этого изменения. Для этого просто вызовите метод GridView DataBind() сразу после вызова DiscontinueAllProductsForSupplier(supplierID) метода .

После нажатия кнопки Прекратить все продукты поставщика обновляются соответствующим образом.

Рис. 17. После нажатия кнопки "Прекратить все продукты" продукты поставщика обновляются соответствующим образом (щелкните для просмотра полноразмерного изображения)

Шаг 6. Создание перегрузки UpdateProduct на уровне бизнес-логики для корректировки цены продукта

Как и в случае с кнопкой "Прекратить все продукты" в FormView, чтобы добавить кнопки для увеличения и снижения цены на продукт в GridView, необходимо сначала добавить соответствующие методы уровня доступа к данным и уровня бизнес-логики. Так как у нас уже есть метод, который обновляет одну строку продукта в DAL, мы можем предоставить такую функциональность, создав новую перегрузку UpdateProduct для метода в BLL.

Наши прошлые UpdateProduct перегрузки принимали некоторое сочетание полей продукта в качестве скалярных входных значений, а затем обновляли только эти поля для указанного продукта. Для этой перегрузки мы немного изменимся от этого стандарта и вместо этого передадим в продукте ProductID и процент, на который следует корректировать UnitPrice (в отличие от передачи нового, скорректированного UnitPrice себя). Такой подход упростит код, который необходимо написать в классе кода программной части ASP.NET страницы, так как нам не нужно беспокоиться об определении текущего продукта UnitPrice.

Перегрузка UpdateProduct для этого руководства показана ниже:

Public Function UpdateProduct _
    (unitPriceAdjustmentPercentage As Decimal, productID As Integer) As Boolean
    Dim products As Northwind.ProductsDataTable = Adapter.GetProductByProductID(productID)
    If products.Count = 0 Then
        ' no matching record found, return false
        Return False
    End If
    Dim product As Northwind.ProductsRow = products(0)
    ' Adjust the UnitPrice by the specified percentage (if it's not NULL)
    If Not product.IsUnitPriceNull() Then
        product.UnitPrice *= unitPriceAdjustmentPercentage
    End If
    ' Update the product record
    Dim rowsAffected As Integer = Adapter.Update(product)
    ' Return true if precisely one row was updated, otherwise false
    Return rowsAffected = 1
End Function

Эта перегрузка извлекает сведения об указанном продукте с помощью метода DAL GetProductByProductID(productID) . Затем он проверяет, назначено ли продукту UnitPrice значение базы данных NULL . Если это так, цена остается без изменения. Однако если имеется значение, отличноеNULLUnitPrice от значения, метод обновляет продукт UnitPrice на указанный процент (unitPriceAdjustmentPercent).

Шаг 7. Добавление кнопок Увеличения и Уменьшения в GridView

GridView (и DetailsView) состоят из коллекции полей. В дополнение к BoundFields, CheckBoxFields и TemplateFields, ASP.NET включает ButtonField, который, как следует из названия, отрисовывается в виде столбца с Button, LinkButton или ImageButton для каждой строки. Как и в FormView, нажатие любой кнопки на страницах GridView, кнопок "Изменить" или "Удалить", кнопок сортировки и т. д. вызывает обратную передачу и вызывает событие GridViewRowCommand.

ButtonField имеет CommandName свойство , которое присваивает указанное значение каждому свойству Button CommandName . Как и в Случае с FormView, CommandName значение используется обработчиком RowCommand событий, чтобы определить, какая кнопка была нажата.

Добавим два новых ButtonField в GridView: один с текстом кнопки Цена +10 %, а другой — с текстом Цена -10 %. Чтобы добавить эти ButtonFields, щелкните ссылку Изменить столбцы в смарт-теге GridView, выберите тип поля ButtonField в списке в левом верхнем углу и нажмите кнопку Добавить.

Добавление двух полей кнопок в GridView

Рис. 18. Добавление двух полей кнопок в GridView

Переместите два ButtonField, чтобы они отображались в качестве первых двух полей GridView. Затем задайте Text для свойств этих двух ButtonFields значение Price +10% и Price -10%, а CommandName для свойств — Значение IncreasePrice и DecreasePrice соответственно. По умолчанию ButtonField отображает свой столбец кнопок как LinkButtons. Однако его можно изменить с помощью свойства ButtonField.ButtonType Пусть эти два ButtonField отрисовывается как обычные кнопки; поэтому присвойте свойству ButtonType значение Button. На рисунке 19 показано диалоговое окно Поля после внесения этих изменений. после этого — декларативная разметка GridView.

Настройка свойств Text, CommandName и ButtonType ButtonFields

Рис. 19. Настройка свойств ButtonFields Text, CommandNameи ButtonType

<asp:GridView ID="SuppliersProducts" runat="server" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="SuppliersProductsDataSource"
    EnableViewState="False">
    <Columns>
        <asp:ButtonField ButtonType="Button" CommandName="IncreasePrice"
            Text="Price +10%" />
        <asp:ButtonField ButtonType="Button" CommandName="DecreasePrice"
            Text="Price -10%" />
        <asp:BoundField DataField="ProductName" HeaderText="Product"
            SortExpression="ProductName" />
        <asp:BoundField DataField="UnitPrice" HeaderText="Price"
            SortExpression="UnitPrice" DataFormatString="{0:C}"
            HtmlEncode="False" />
        <asp:CheckBoxField DataField="Discontinued" HeaderText="Discontinued"
            SortExpression="Discontinued" />
    </Columns>
</asp:GridView>

После создания этих ButtonFields последним шагом является создание обработчика событий для события GridView RowCommand . Этот обработчик событий, если был вызван нажатием кнопки Цена +10 % или Цена -10 %, должен определить ProductID для строки, кнопка которой была нажата, а затем вызвать ProductsBLL метод класса , UpdateProduct передав соответствующую UnitPrice корректировку процента вместе с ProductID. Следующий код выполняет следующие задачи:

Protected Sub SuppliersProducts_RowCommand _
    (sender As Object, e As GridViewCommandEventArgs) _
        Handles SuppliersProducts.RowCommand
    If e.CommandName.CompareTo("IncreasePrice") = 0 OrElse _
       e.CommandName.CompareTo("DecreasePrice") = 0 Then
        ' The Increase Price or Decrease Price Button has been clicked
        ' Determine the ID of the product whose price was adjusted
        Dim productID As Integer = Convert.ToInt32( _
            SuppliersProducts.DataKeys(Convert.ToInt32(e.CommandArgument)).Value)
        ' Determine how much to adjust the price
        Dim percentageAdjust As Decimal
        If e.CommandName.CompareTo("IncreasePrice") = 0 Then
            percentageAdjust = 1.1
        Else
            percentageAdjust = 0.9
        End If
        ' Adjust the price
        Dim productInfo As New ProductsBLL()
        productInfo.UpdateProduct(percentageAdjust, productID)
    End If
End Sub

Чтобы определить ProductID для строки, для которой была нажата DataKeys кнопка Price +10% или Price -10%, необходимо обратиться к коллекции GridView. Эта коллекция содержит значения полей, указанных в свойстве DataKeyNames для каждой строки GridView. Так как при привязке ObjectDataSource к GridView свойству GridView DataKeyNames было присвоено значение ProductID в Visual Studio, DataKeys(rowIndex).Value предоставляет ProductID для указанного rowIndex.

ButtonField автоматически передает значение rowIndex строки, кнопка которой была нажата e.CommandArgument с помощью параметра . Таким образом, чтобы определить ProductID для строки, для которой была нажата кнопка Цена +10 % или Цена -10 %, используется: Convert.ToInt32(SuppliersProducts.DataKeys(Convert.ToInt32(e.CommandArgument)).Value).

Как и при нажатии кнопки Прекратить все продукты, если вы отключили состояние представления GridView, GridView возвращается к базовому хранилищу данных при каждой обратной отправке и, следовательно, немедленно обновляется, чтобы отразить изменение цены, которое происходит при нажатии любой из кнопок. Однако если состояние представления в GridView не отключено, необходимо вручную повторно привязать данные к GridView после внесения этого изменения. Для этого просто вызовите метод GridView DataBind() сразу после вызова UpdateProduct метода .

На рисунке 20 показана страница при просмотре продуктов, предоставляемых homestead бабушки Келли. На рисунке 21 показаны результаты после того, как кнопка Цена +10% была нажата дважды для спреда Бойсенберри бабушки и кнопка Цена -10% один раз для Нортвудса Cranberry Sauce.

GridView содержит кнопки Price +10% и Price -10%

Рис. 20. GridView содержит кнопки Price +10% и Price -10% (Щелкните для просмотра полноразмерного изображения)

Цены на первый и третий продукт были обновлены с помощью кнопок Цена +10% и Цена -10%

Рис. 21. Цены на первый и третий продукт были обновлены с помощью кнопок Цена +10% и Цена -10% (Нажмите для просмотра полноразмерного изображения)

Примечание

GridView (и DetailsView) также могут добавлять кнопки, linkButtons или ImageButtons в свои templateFields. Как и в случае с BoundField, эти кнопки при нажатии вызывают обратную передачу, вызывая событие GridView RowCommand . Однако при добавлении кнопок в TemplateField для элемента Button CommandArgument не устанавливается индекс строки автоматически, как при использовании ButtonFields. Если необходимо определить индекс строки кнопки, которая была нажата в RowCommand обработчике событий, необходимо вручную задать свойство Button в декларативном CommandArgument синтаксисе в TemplateField, используя следующий код:
<asp:Button runat="server" ... CommandArgument='<%# CType(Container, GridViewRow).RowIndex %>' />.

Сводка

Элементы управления GridView, DetailsView и FormView могут включать элементы управления Button, LinkButtons или ImageButtons. Такие кнопки при нажатии вызывают обратную передачу ItemCommand и вызывают событие в элементах управления FormView и DetailsView и RowCommand событие в GridView. Эти веб-элементы управления данными имеют встроенные функции для обработки распространенных действий, связанных с командами, таких как удаление или изменение записей. Однако мы также можем использовать кнопки, которые при нажатии отвечают на выполнение собственного пользовательского кода.

Для этого необходимо создать обработчик событий для ItemCommand события или RowCommand . В этом обработчике событий сначала проверка входящее CommandName значение, чтобы определить, какая кнопка была нажата, а затем выполнить соответствующее настраиваемое действие. В этом руководстве мы узнали, как использовать кнопки и ButtonFields, чтобы отменить все продукты для указанного поставщика или увеличить или уменьшить цену на определенный продукт на 10 %.

Счастливого программирования!

Об авторе

Скотт Митчелл( Scott Mitchell), автор семи книг ASP/ASP.NET и основатель 4GuysFromRolla.com, работает с веб-технологиями Майкрософт с 1998 года. Скотт работает независимым консультантом, тренером и писателем. Его последняя книга Sams Teach Yourself ASP.NET 2.0 в 24 часах. Он может быть доступен в mitchell@4GuysFromRolla.com. или через его блог, который можно найти по адресу http://ScottOnWriting.NET.