SQLDataSource + GridView + ItemTemplate + DropDownList + JavaScript (DOM) 使用方法
WebForm5.aspx |
<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="WebForm7.aspx.cs" Inherits="WebApplication9.WebForm7" %> <asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server"> <script type="text/javascript"> function SelectTeam(obj) { if (obj.value.toString() == 0) { for (var k = 0; k < CountRow(); k++) { document.getElementById("MainContent_GridView1_Label1_" + k.toString()).setAttribute("style", "display:"); } }else{ for (var j = 0; j < CountRow(); j++) { if (document.getElementById("MainContent_GridView1_HiddenField2_" + j.toString()).getAttribute("value") == obj.value.toString()) { document.getElementById("MainContent_GridView1_Label2").innerHTML = obj.options[obj.selectedIndex].text + " Player Name"; document.getElementById("MainContent_GridView1_Label1_" + j.toString()).setAttribute("style", "display:"); } else { document.getElementById("MainContent_GridView1_Label1_" + j.toString()).setAttribute("style", "display:none"); } } } } function CountRow() { for (var i = 0; (document.getElementById("MainContent_GridView1_HiddenField1_" + i.toString()) != null); i++) {} return i; } </script> </asp:Content> <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="Data Source=.\SqlExpress; Initial Catalog=Soccer; Integrated Security=SSPI" SelectCommand="SELECT * FROM dbo.Team ORDER BY Team_Name" /> <asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SqlDataSource1" DataTextField="Team_Name" DataValueField="Team_ID" onChange="SelectTeam(this);" AppendDataBoundItems="True"> <asp:ListItem Selected="True" Text="All Record" Value="0"/> </asp:DropDownList> <br /><br /> <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="Data Source=.\SqlExpress; Initial Catalog=Soccer; Integrated Security=SSPI" SelectCommand="SELECT * FROM dbo.Player" /> <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource2" AutoGenerateColumns="false" GridLines="None" CellPadding="0" BorderStyle="None" > <Columns> <asp:TemplateField HeaderStyle-HorizontalAlign="Left"> <HeaderTemplate> <asp:Label ID="Label2" runat="server" Text="Player Name" /> </HeaderTemplate> <ItemTemplate> <asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Eval("Player_ID") %>' /> <asp:HiddenField ID="HiddenField2" runat="server" Value='<%# Eval("Team_ID") %>' /> <asp:Label ID="Label1" runat="server" Text='<%# Eval("Player_Name") %>' style="display:" /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> </asp:Content> |