ASP.Net ボタンと GridView が異なる asp:Content ブロックにある場合、ASP.Net GridView を更新したいと考えています。
動作中の ASP.Net Web フォームには、DataSource、GridView、DetailsView、その他のさまざまなコントロール、ユーザーがテキスト ボックスに入力した内容に基づいてデータを検索するための asp:TextBox および asp:Button がありました。これらはすべて単一の asp:Content ブロックにあり、asp:UpdatePanel もありました。
フォームのレイアウトを変更し、GridView と DetailsView を分離して別の asp:Content ブロックに配置することにしました。フォームが実行されると、すべてが画面上の正しい場所に表示され、データベースからのデータも期待どおりに表示されました。
ユーザーが検索条件を入力して検索ボタンをクリックすると、コード ビハインド ファイルのコードは実行されますが、GridView は更新されませんでした。
そのためには、分離コード ファイルに追加のコーディングを追加する必要があると想定します。
asp:Content ブロックの 1 つからの検索ボタンのマークアップを次に示します。
<asp:Content
ID="ContentBody"
ContentPlaceHolderID="BodyPlaceholder"
runat="server">
<% '-- Ajax enable this area so flicker us cut down to a minumum. -- %>
<% '---------------------------------------------------------------- %>
<asp:UpdatePanel
ID="UpdatePanelSummary"
runat="server"
UpdateMode="Conditional">
<ContentTemplate>
<h1>Classes / Subjects Maintenance</h1>
Class Search:
<asp:TextBox
ID="TextBoxSearch"
runat="server"
Width="207px"
Text="ALL">
</asp:TextBox>
<asp:Button
ID="ButtonSearch"
runat="server"
Text="Search"
OnClick="ButtonSearch_Click" />
<asp:Button
ID="ButtonSearchAll"
runat="server"
Text="Show ALL Classes"
OnClick="ButtonSearchAll_Click"/>
<br />
<asp:Button
ID="ButtonAddNewClass"
runat="server"
Text="Add a New Class to this List" />
<br />
<strong><span class="auto-style1">
<br />
To send an email of this list, enter the email address of whom you wish to send it to then click the envelope.</span></strong>
<br />
<br />
Recipient:
<asp:TextBox ID="TextBoxEmailRecipient" runat="server" Width="203px"></asp:TextBox>
<strong><span class="auto-style1"> </span></strong>
<asp:ImageButton
ID="ImageButtonEmailThisList"
runat="server"
BorderStyle="None"
ImageUrl="~/Images/email1.png"
OnClick="ImageButtonEmailThisList_Click"
ToolTip="Email this List as a report." Height="50px" Width="50px"
/>
<br />
<asp:Label ID="LabelEmailMessage" runat="server" style="font-weight: 700; color: black"></asp:Label>
<br />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
これは、GridView を持つ asp:Content ブロックのマークアップです。
<asp:Content
ID="DetailsBody"
ContentPlaceHolderID="DetailsPlaceholder"
runat="server">
<asp:UpdatePanel
ID="UpdatePanelDetails"
runat="server"
UpdateMode="Conditional">
<ContentTemplate>
<% '-- GridView (Grid) for summary. -- %>
<% '-- The user chooses a Class from here and details are shown in a DetailsView. -- %>
<% '--------------------------------------------------------------------------------- %>
<asp:GridView
ID="GridViewSummary"
runat="server"
AllowSorting="True"
AutoGenerateColumns="False"
DataKeyNames="ID"
Width="401px"
AllowPaging="True"
PageSize="3">
<Columns>
<asp:BoundField DataField="ClassName" HeaderText="Class / Subject"
SortExpression="ClassName" >
<HeaderStyle HorizontalAlign="Left" />
<ItemStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:BoundField DataField="Grade" HeaderText="Grade"
SortExpression="Grade" >
<HeaderStyle HorizontalAlign="Left" />
<ItemStyle HorizontalAlign="Left" />
</asp:BoundField>
<asp:CommandField ButtonType="Button" SelectText="Select Class Details"
ShowSelectButton="True"/>
</Columns>
<PagerSettings FirstPageText="First" LastPageText="Last" Mode="NextPreviousFirstLast" NextPageText="Next" PreviousPageText="Previous"/>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
多くのコントロールが削除されているため、このコードは簡単に理解できます。
これは、ユーザーが検索ボタンをクリックした後に GridView にデータを読み込む分離コード ファイルからのコーディングです。
Protected Sub ButtonSearch_Click(sender As Object, e As EventArgs)
' Show the schedules the user wants.
'-----------------------------------
GridViewSummary.DataSource = theTableAdapter.GetDataByAllClasses(TextBoxSearch.Text)
GridViewSummary.DataBind()
End Sub