ما از منبع داده SQL برای اتصال GridView و DetailView استفاده می کنیم.
اتاق اولیه
مرحله 1: Visual Studio 2010 را باز کنید و یک وب سایت خالی ایجاد کنید. یک نام مناسب gridview_demo بگذارید .
مرحله 2: در Solution Explorer، وب سایت خالی خود را دریافت می کنید، سپس یک فرم وب و پایگاه داده SQL Server را اضافه می کنید. در اینجا مراحل انجام می شود:
برای فرم وب
gridview_demo (وب سایت خالی شما) - کلیک راست کنید، افزودن آیتم جدید و سپس فرم وب. نام آن را gridviewid_demo.aspx بگذارید .
برای پایگاه داده SQL Server:
gridview_demo (وب سایت خالی شما) - کلیک راست کنید، Add New Item و سپس SQL Server Database. پایگاه داده را در پوشه App_Data_افزودن کنید.
اتاق پایگاه داده
مرحله 3: در Server Explorer، روی پایگاه داده خود کلیک کنیدDatabase.mdf - جداول، جدول جدید اضافه کنید و جدولی مانند این تشکیل دهید:
Table - tbl_data و فراموش نکنید که شناسه را به عنوان IS Identity - True
Design chamber
مرحله 4: اکنون با رفتن به gridviewid_demo.aspx، برای برنامه خود طراحی کنید. و کد زیر را امتحان کنید:
Gridviewid_demo.aspx
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" 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></title>
- <style type="text/css">
- .style1 {
- width: 229px;
- }
- .style2 {
- width: 24px;
- }
- .style3 {
- text-decoration: underline;
- }
- </style>
- </head>
- <body>
- <form id="form1" runat="server">
- <div class="style3"> <strong>GridView to DetailsView<br />
- </strong> </div>
- <table style="width:100%;">
- <tr>
- <td class="style1">
- <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT [id], [name] FROM [tbl_data]"></asp:SqlDataSource>
- </td>
- <td class="style2"> </td>
- <td> </td>
- </tr>
- <tr>
- <td class="style1">
- <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="id" DataSourceID="SqlDataSource2" CellPadding="4" ForeColor="#333333" GridLines="None">
- <AlternatingRowStyle BackColor="White" />
- <Columns>
- <asp:BoundField DataField="id" HeaderText="ID" InsertVisible="False" ReadOnly="True" SortExpression="id" />
- <asp:BoundField DataField="name" HeaderText="Name" SortExpression="name" />
- <asp:CommandField ShowSelectButton="True" /> </Columns>
- <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
- <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
- <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
- <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
- <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
- <SortedAscendingCellStyle BackColor="#FDF5AC" />
- <SortedAscendingHeaderStyle BackColor="#4D0000" />
- <SortedDescendingCellStyle BackColor="#FCF6C0" />
- <SortedDescendingHeaderStyle BackColor="#820000" /> </asp:GridView>
- </td>
- <td class="style2"> </td>
- <td> </td>
- </tr>
- <tr>
- <td class="style1">
- <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" DeleteCommand="DELETE FROM [tbl_data] WHERE [id] = @id" InsertCommand="INSERT INTO [tbl_data] ([name], [age], [phone], [email], [city]) VALUES (@name, @age, @phone, @email, @city)" SelectCommand="SELECT [id], [name], [age], [phone], [email], [city] FROM [tbl_data] WHERE ([id] = @id)" UpdateCommand="UPDATE [tbl_data] SET [name] = @name, [age] = @age, [phone] = @phone, [email] = @email, [city] = @city WHERE [id] = @id">
- <DeleteParameters>
- <asp:Parameter Name="id" Type="Int32" /> </DeleteParameters>
- <InsertParameters>
- <asp:Parameter Name="name" Type="String" />
- <asp:Parameter Name="age" Type="Decimal" />
- <asp:Parameter Name="phone" Type="Decimal" />
- <asp:Parameter Name="email" Type="String" />
- <asp:Parameter Name="city" Type="String" /> </InsertParameters>
- <SelectParameters>
- <asp:ControlParameter ControlID="GridView1" Name="id" PropertyName="SelectedValue" Type="Int32" /> </SelectParameters>
- <UpdateParameters>
- <asp:Parameter Name="name" Type="String" />
- <asp:Parameter Name="age" Type="Decimal" />
- <asp:Parameter Name="phone" Type="Decimal" />
- <asp:Parameter Name="email" Type="String" />
- <asp:Parameter Name="city" Type="String" />
- <asp:Parameter Name="id" Type="Int32" /> </UpdateParameters>
- </asp:SqlDataSource>
- </td>
- <td class="style2"> </td>
- <td> </td>
- </tr>
- <tr>
- <td class="style1">
- <asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False" DataKeyNames="id" DataSourceID="SqlDataSource1" Height="50px" Width="125px" CellPadding="4" ForeColor="#333333" GridLines="None">
- <AlternatingRowStyle BackColor="White" />
- <CommandRowStyle BackColor="#FFFFC0" Font-Bold="True" />
- <FieldHeaderStyle BackColor="#FFFF99" Font-Bold="True" />
- <Fields>
- <asp:BoundField DataField="id" HeaderText="ID" InsertVisible="False" ReadOnly="True" SortExpression="id" />
- <asp:BoundField DataField="name" HeaderText="Name" SortExpression="name" />
- <asp:BoundField DataField="age" HeaderText="Age" SortExpression="age" />
- <asp:BoundField DataField="phone" HeaderText="Phone" SortExpression="phone" />
- <asp:BoundField DataField="email" HeaderText="Email" SortExpression="email" />
- <asp:BoundField DataField="city" HeaderText="City" SortExpression="city" /> </Fields>
- <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
- <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
- <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
- <RowStyle BackColor="#FFFBD6" ForeColor="#333333" /> </asp:DetailsView>
- </td>
- <td class="style2"> </td>
- <td> </td>
- </tr>
- </table>
- </form>
- </body>
- </html>
روش جایگزین: [برای GridView]
Window Wizard Configuration Source Data