ASP.Netのお勉強

DataListで選択してDetailsViewで表示＠ASP.Net

DetaListで一覧を表示し、
選択された値を元にDetailsViewに詳細を表示します。

DetaList、DetailsViewを配置します。

DataListの設定を行います。
SqlDataSourceを作成します。
あるマスタテーブルを全件検索するSqlDataSourceを作成し、
DataListに設定します。

DataKeyFieldにキーを設定します。
また、ItemTemplateにはボタンを配置し、
表示したカラムのデータを表示します。
ボタンのCommandNameは、「Select」とします。

DetailsViewを設定します。
SqlDataSourceを作成します。
DetaListのキー項目による条件検索を作成します。

作成した、SqlDataSourceをDetailsViewに設定します。
Fieldsに表示したデータを設定します。

●aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb"
Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>DataLIstとDetailsView</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <table cellpadding="5">
    <tr><td valign="top" style="width: 62px">
        <asp:DataList ID="dataList" runat="server" DataKeyField="ID"
        DataSourceID="dataListSource" CellPadding="4" ForeColor="#333333"
        Width="150px">
            <ItemTemplate>
                <asp:LinkButton ID="LinkButton1" CommandName="Select"
                runat="server" Text='<%# Eval("NAME") %>'></asp:LinkButton>
            </ItemTemplate>
            <FooterStyle BackColor="#5D7B9D" Font-Bold="True"ForeColor="White" />
            <AlternatingItemStyle BackColor="White" ForeColor="#284775" />
            <ItemStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <SelectedItemStyle BackColor="#E2DED6" Font-Bold="True"ForeColor="#333333" />
            <HeaderTemplate>
                名前
            </HeaderTemplate>
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True"ForeColor="White" />
        </asp:DataList>
    </td><td style="width: 208px" valign="top">
        <asp:DetailsView ID="detailsView" runat="server" Height="50px"
        Width="300px" AutoGenerateRows="False" DataKeyNames="ID"
        DataSourceID="detailsViewSource" CellPadding="4" ForeColor="#333333"
        GridLines="None">
            <Fields>
                <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID" />
                <asp:BoundField DataField="NAME" HeaderText="NAME"SortExpression="NAME" />
            </Fields>
            <FooterStyle BackColor="#1C5E55" Font-Bold="True"ForeColor="White" />
            <CommandRowStyle BackColor="#C5BBAF" Font-Bold="True" />
            <RowStyle BackColor="#E3EAEB" />
            <FieldHeaderStyle BackColor="#D0D0D0" Font-Bold="True" />
            <PagerStyle BackColor="#666666" ForeColor="White"HorizontalAlign="Center" />
            <HeaderStyle BackColor="#1C5E55" Font-Bold="True"ForeColor="White" />
            <EditRowStyle BackColor="#7C6F57" />
            <AlternatingRowStyle BackColor="White" />
        </asp:DetailsView>
    </td></tr>
    </table>
    </div>
    <asp:SqlDataSource ID="dataListSource" runat="server"ConnectionString="<%$ ConnectionStrings:DBConnectionString %>"
        SelectCommand="SELECT [ID], [NAME] FROM [TABLE]"></asp:SqlDataSource>
    <asp:SqlDataSource ID="detailsViewSource" runat="server"ConnectionString="<%$ ConnectionStrings:DBConnectionString %>"
        SelectCommand="SELECT [ID], [NAME] FROM [TABLE] WHERE ([ID] = @ID)">
        <SelectParameters>
            <asp:ControlParameter ControlID="dataList" Name="ID"PropertyName="SelectedValue"Type="String" />
        </SelectParameters>
    </asp:SqlDataSource>
    </form>
</body>
</html>

Copyright (C) ASP.Netのお勉強. All Rights Reserved.