如何在gridview中使用单选按钮

问题描述 投票:0回答:1

我有一个网格视图,其中一列中包含单选按钮,另一列中包含提交按钮..因此,如果我选择其中一个单选按钮并单击提交,它必须将消息传递到另一页面..

我的gridview代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="stafflogin.aspx.cs" Inherits="gatepass.stafflogin" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
          <div >
             
            
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" BackColor="LightGoldenrodYellow" OnRowDataBound="GridView1_RowDataBound" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
            <Columns>
                 <asp:BoundField DataField="regno" HeaderText="RegNo" SortExpression="regno" />
                 <asp:BoundField DataField="reason" HeaderText="Reason" SortExpression="reason" />
                 <asp:BoundField DataField="type" HeaderText="Type" SortExpression="type" />
                 <asp:BoundField DataField="dol" HeaderText="Date Of Leaving" SortExpression="dol" />
                 <asp:BoundField DataField="tol" HeaderText="Time Of Leaving" SortExpression="tol" />
                 <asp:BoundField DataField="dor" HeaderText="Date Of Reaturn" SortExpression="dor" />
                 <asp:BoundField DataField="tor" HeaderText="Time Of Return" SortExpression="name" />
                <asp:TemplateField HeaderText="Permission">
            <ItemTemplate>  
                                        

<asp:RadioButtonList ID="RadioButtonList1" runat="server">  
    <asp:ListItem  Text="Approved" Value="1"></asp:ListItem>  
      <asp:ListItem  Text="Not Approved" Value="2"></asp:ListItem>  
                                        </asp:RadioButtonList>  
                                    </ItemTemplate>  
        </asp:TemplateField>
                <asp:TemplateField HeaderText="Submit">
            <ItemTemplate>
          <asp:Button Text="Submit" runat="server" CommandName="Submit" OnClick="Submit_click" />
            </ItemTemplate>
        </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </form>`` 
</body>
</html>
c# asp.net
1个回答
0
投票

好吧,这也许是我们可以使用 GridView 执行的最常见的操作之一。一行上的一个按钮,我们单击该按钮,从该行获取数据,然后按照您的要求,跳转到另一个页面并传递该信息。或者更好的是获取数据库行 PK id。

事实上,在这个例子中?为什么不隐藏 GV,然后说显示一个 div 并说更多细节。

一些事情:

几乎不需要使用命令名称。只需使用普通按钮单击事件,我将向您展示如何获取所需的行信息。

接下来:

尝试始终使用 gridView 的 datakeys 功能。 Datakeys 非常好,因为它允许您获取行 PK 数据库 ID,但不必公开或显示,甚至不必在数据或标记中公开数据库行 PK。出于安全原因,这是一件大事。 (数据密钥是 100% 服务器端为您管理的 - 因此相当安全。(用户无法更改标记“ID”,从而获取或查看他们想要的任何数据库行)。

更重要的是,datakeys 功能不仅让您可以免费使用数据库行 PK id,而且不会向客户端浏览器公开此类数据库 PK id。这也减少了混乱的参数,甚至隐藏字段来使用行 PK id。

接下来:

您确实不需要使用 GV 的选定索引事件。我想你可以用于其他目的,但我们只需要一个简单的按钮,然后我们编写简单的标准普通按钮单击事件。

那么,让我们看一个简单的酒店列表。我们放入一个单选按钮列表(比如酒店评级 - 好、坏等)。

当我们单击按钮时,让我们获取行信息(在本例中为单选按钮列表和数据库行 PK id)。

因此,一个简单的网格视图(注意我们如何不需要 OnSelectedIndexChanged 事件)。

事实上,请注意我们没有费心使用 CommandName。在大多数情况下,我们确实不关心、也不需要、甚至不必费心处理所有这些 GridView 事件。

在大多数情况下,这些事件会给你带来更多的痛苦和努力。

因此,我们简单的 GridView - 请注意 Datakeys 设置。好的,这个:

    <div id="mygrid" runat="server" style="width:60%">
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
            DataKeyNames="ID" 
            CssClass="table" OnRowDataBound="GridView1_RowDataBound" >
            <Columns>
                <asp:BoundField DataField="FirstName" HeaderText="FirstName"  />
                <asp:BoundField DataField="LastName" HeaderText="LastName"    />
                <asp:BoundField DataField="HotelName" HeaderText="HotelName"  />
                <asp:BoundField DataField="Description" HeaderText="Description" ItemStyle-Width="270" />

                <asp:TemplateField HeaderText="Rating">
                    <ItemTemplate>
                        <asp:RadioButtonList ID="rbRating" runat="server" RepeatDirection="Horizontal" 
                            CssClass="rBut"
                            SelectedValue='<%# Eval("Rating") %>'>
                            <asp:ListItem Value="0">No Rating</asp:ListItem>
                            <asp:ListItem Value="1">Poor</asp:ListItem>
                            <asp:ListItem Value="2">Fair</asp:ListItem>
                            <asp:ListItem Value="3">Good</asp:ListItem>
                            <asp:ListItem Value="4">Excellent</asp:ListItem>
                            <asp:ListItem Value="5">5 Stars</asp:ListItem>
                        </asp:RadioButtonList>
                    </ItemTemplate>
                </asp:TemplateField>

                <asp:TemplateField HeaderText="View">
                    <ItemTemplate>
                        <asp:Button ID="cmdView" runat="server" Text="View" CssClass="btn"
                            OnClick="cmdView_Click"/>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>

    </div>

我们要加载的代码:

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadGrid();
    }

    void LoadGrid()
    {
        GridView1.DataSource = MyRst("SELECT * FROM tblHotelsA ORDER BY HotelName");
        GridView1.DataBind();
    }

    public DataTable MyRst(string strSQL)
    {
        DataTable rstData = new DataTable();
        using (SqlCommand cmdSQL = new SqlCommand(strSQL,
            new SqlConnection(Properties.Settings.Default.TEST4)))
        {
            cmdSQL.Connection.Open();
            rstData.Load(cmdSQL.ExecuteReader());
            cmdSQL.Connection.Dispose();
        }
        return rstData;
    }

现在我们有了这个:

现在,我们的按钮代码。

请注意,您可以正常单击按钮来创建单击事件。但是,由于按钮位于 GV“内部”?

然后只需使用标记添加点击事件即可。在按钮中输入 OnClick=

当您点击“=”时,请密切注意 IntelliSense 会弹出一个创建新事件的选项。选择创建新事件 - 似乎没有发生任何事情,但是如果您翻转到代码隐藏,您会看到新的按钮单击事件。

所以,你这样做:

因此,选择创建新事件,我们现在看到:

<asp:TemplateField HeaderText="View">
    <ItemTemplate>
        <asp:Button ID="cmdView" runat="server" Text="View" CssClass="btn"
            OnClick="cmdView_Click"/>
    </ItemTemplate>
</asp:TemplateField>

所以,现在回到后面的代码,我们的按钮代码可以做到这一点:

protected void cmdView_Click(object sender, EventArgs e)
{
    Button btn = sender as Button;
    GridViewRow gRow = btn.NamingContainer as GridViewRow;

    // get database PK id
    int? PKID = GridView1.DataKeys[gRow.RowIndex]["ID"] as int?;
    Debug.Print("Row index click = " + gRow.RowIndex);
    Debug.Print("database PK row ID = = " + PKID);
    Debug.Print("Hotel name = " + gRow.Cells[2].Text);

    RadioButtonList rbList = gRow.FindControl("rbRating") as RadioButtonList;

    Debug.Print("Rating selected value = " + rbList.SelectedItem.Value);
    Debug.Print("Rating selected Text = " + rbList.SelectedItem.Text);

输出:

Row index click = 3
database PK row ID = = 2
Hotel name = Ramada Lodge
Rating selected value = 2
Rating selected Text = Fair

所以,此时,我们可以将 PK 设置为 session() 或者其他什么,然后跳转到另一个页面。

或者,我们可以在 GV 周围放置一个“div”,然后放入一个中继器,并放入该行的详细信息。

像这样说:

    <div id="mydetails" runat="server" style="display:none">
        <asp:Repeater ID="repDetails" runat="server">
        <ItemTemplate>
       <div style="border-style:solid;color:black;width:45%;float:left;padding:10px">
            <div style="padding:5px;text-align:right;float:left">
                <p>Hotel Name: <asp:TextBox ID="HotelName" runat="server" Text ='<%# Eval("HotelName") %>' /></p>
                <p>First Name: <asp:TextBox ID="FirstName" runat="server" Text ='<%# Eval("FirstName") %>' /></p>
                <p>Last Name: <asp:TextBox ID="LastName" runat="server" Text ='<%# Eval("LastName") %>'    /></p>
                <p>City: <asp:TextBox ID="City" runat="server" Text ='<%# Eval("City") %>'  /></p>
                <p>Province: <asp:TextBox ID="Province" runat="server" Text ='<%# Eval("Province") %>'  /></p>
                Active: <asp:CheckBox ID="Active" runat="server" Checked = '<%# Eval("Active") %>'/>
            </div>

            <div style="float:left;margin-left:15px">

                <div style="float:left">
                Hotel Name: <asp:TextBox ID="txtDescription" runat="server" 
                    Text ='<%# Eval("Description") %>' TextMode="MultiLine" Rows="6" Columns="40"  />
                </div>
                <div style="float:left;margin-left:28px">
                    <asp:RadioButtonList ID="rbRating" runat="server"  
                            CssClass="rBut"
                            SelectedValue='<%# Eval("Rating") %>'>
                            <asp:ListItem Value="0">No Rating</asp:ListItem>
                            <asp:ListItem Value="1">Poor</asp:ListItem>
                            <asp:ListItem Value="2">Fair</asp:ListItem>
                            <asp:ListItem Value="3">Good</asp:ListItem>
                            <asp:ListItem Value="4">Excellent</asp:ListItem>
                            <asp:ListItem Value="5">5 Stars</asp:ListItem>
                        </asp:RadioButtonList>
                </div>
            </div>
        </div>
        </ItemTemplate>
        </asp:Repeater>
        <div style="clear:both"></div>
        <br />
        <asp:Button ID="cmdBack" runat="server" Text="Back" CssClass="btn" OnClick="cmdBack_Click" />
     </div>

所以,现在我们的按钮点击代码变成了这样:

        // jump to another page, or say on this page display details
        mygrid.Style.Add("display", "none");
        mydetails.Style.Add("display", "normal");
        repDetails.DataSource = MyRst("SELECT * from tblHotelsA where ID = " + PKID);
        repDetails.DataBind();

现在,当我们单击一行时,我们会得到:

但是,真的到了最后吗?

您所关心的只是放入一个简单的简按钮。

添加按钮事件。然后在代码中获取我们需要的有关行单击的信息,代码是这样的:

protected void cmdView_Click(object sender, EventArgs e)
{
    Button btn = sender as Button;
    GridViewRow gRow = btn.NamingContainer as GridViewRow;

    // get database PK id
    int? PKID = GridView1.DataKeys[gRow.RowIndex]["ID"] as int?;
    Debug.Print("Row index click = " + gRow.RowIndex);
    Debug.Print("database PK row ID = = " + PKID);
    Debug.Print("Hotel name = " + gRow.Cells[2].Text);

    RadioButtonList rbList = gRow.FindControl("rbRating") as RadioButtonList;

    Debug.Print("Rating selected value = " + rbList.SelectedItem.Value);
    Debug.Print("Rating selected Text = " + rbList.SelectedItem.Text);

注意我们如何获取“发件人”(单击按钮)。

然后我们得到网格视图行(这始终是namingContainer)。这个技巧适用于 GridView、ListView - 大多数控件。

现在我们有了网格视图行?

我们可以获取行索引,PK数据库id,或者使用find控件拔出来获取RadioButtonList控件。

在第二个 div 中我进入页面以显示详细信息?

嗯,它有一个后退按钮 - 返回 GV。但是,我们所做的就是隐藏“详细信息 div”,并显示 GV div。那个后退按钮是这样的:

protected void cmdBack_Click(object sender, EventArgs e)
{
    mygrid.Style.Add("display", "normal");
    mydetails.Style.Add("display", "none");
}
© www.soinside.com 2019 - 2024. All rights reserved.