Question

我有一个asp.net gridview，它为每条记录显示两行，使用下面的代码（示例）。

然而，使用位于页面顶部的下拉列表，根据其选择（1或2），我希望gridview以下列方式更新自己：

选项1 =每条记录显示两行。

选项2 =每条记录只显示一行（下面代码中显示的第二个表行）当选择选项2时，我不希望它显示。

更新：选择下拉列表选项并使其工作正常，我没有问题，但我需要知道如何操作gridview以显示每条记录一行或两行。所以基本上我怎么能（用代码）将gridview的格式从1行改为2行。显然，可以选择使用两个网格视图并根据您的选择显示所需的网格视图，但我更喜欢仅使用一个网格视图（如果可能的话）。

 <HeaderTemplate>
           <asp:LinkButton ID="lbPN" runat="server" Text="Project Name" style "color:white;" CommandName="Sort" CommandArgument="PN"  tabindex="1000" ></asp:LinkButton><br />
           <asp:TextBox runat="server" ID="S_PN" CssClass="FilterField" ></asp:TextBox>
  </HeaderTemplate>
  <ItemTemplate>
           <table  >
              <tr>
                 <td class="STD_normal" style="width:150px; font-weight:bold"><%#Eval("PN")%>
                    </td>                                                    
              </tr>
              <tr>
                 <td class="STD_Normal_Grey" style="width:150px"><%#Eval("DD", "{0:dd-MMM-yyyy}")%> </td>
              </tr>
          </table>                                              
       </ItemTemplate>                                                              
      <HeaderStyle HorizontalAlign="Left"/>
      </asp:TemplateField>

Answer 1

客户端

一种方法是使用JavaScript或jQuery来显示/隐藏第二行。为此，我建议将表格替换为<div>，并将该类添加到div标记而不是td标记，或者将表格拆分，如图所示服务器端示例。

这是一个jQuery示例：

$("#ddl").change(function() {
    if($('#ddl option:selected').val() == 1) {
        $('STD_Normal_Grey').show();
    } else {
        $('STD_Normal_Grey').hide();
    }
}

服务器端

这是另一个显示服务器端选项的示例，以及如何拆分表格以便更轻松地控制显示：

<table>
    <tr>
        <td class="STD_normal" style="width:150px; font-weight:bold">  
            <%#Eval("PN")%>
        </td>                                                    
     </tr>
 </table>
 <table style="display:<%# DdlVal == "1" ? "inline-block" : "none" %>;">
     <tr>
         <td class="STD_Normal_Grey" style="width:150px">
             <%#Eval("DD", "{0:dd-MMM-yyyy}")%>
         </td>
     </tr>
 </table>

然后，在你的代码背后：

protected string DdlVal
{
    get { return ddl.SelectedValue; }
}

这将要求DropDownList回发，而客户端解决方案则不会，使客户端解决方案更快。

Answer 2

基于我的一个数据库的代码，只是更改参数（这是服务器端示例，其他人在这里提供客户端示例）：

aspx：

<asp:DropDownList runat="server" ID="ddlChoice" AutoPostBack="true">
       <asp:ListItem Text="One row"></asp:ListItem>
       <asp:ListItem Text="Two rows"></asp:ListItem>
      </asp:DropDownList>
      <br /><br />
      <asp:GridView runat="server" ID="grdInfo" DataSourceID="sqlInfo">
       <Columns>
        <asp:TemplateField>
         <HeaderTemplate>
           <asp:LinkButton ID="lbPN" runat="server" Text="Project Name" style="color:white;" CommandName="Sort" CommandArgument="PN"  tabindex="1000" ></asp:LinkButton><br />
           <asp:TextBox runat="server" ID="S_PN" CssClass="FilterField" ></asp:TextBox>
         </HeaderTemplate>
         <ItemTemplate>
          <table>
           <tr><td runat="server" id="tdFirst" class="STD_normal" style="width:150px; display:block; font-weight:bold"><%# Eval("PNaziv")%></td></tr>
           <tr><td runat="server" id="tdSecond" class="STD_Normal_Grey" style="width:150px; display:none;"><%#Eval("PMesto")%></td></tr>
          </table>
         </ItemTemplate>
        </asp:TemplateField>
       </Columns>
      </asp:GridView>
      <asp:SqlDataSource ID="sqlInfo" runat="server" ConnectionString="<%$ ConnectionStrings:MDFConnection %>" SelectCommand="SELECT PNaziv,PMesto FROM Partneri ORDER BY PNaziv;" ></asp:SqlDataSource>

代码（vb.net）

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    End Sub

    Private Sub ddlChoice_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles ddlChoice.SelectedIndexChanged
        grdInfo.DataBind()
    End Sub

    Private Sub grdInfo_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles grdInfo.RowCreated
        If e.Row.RowType = DataControlRowType.DataRow Then
            Dim td As HtmlTableCell = e.Row.Cells(0).FindControl("tdSecond")
            If ddlChoice.SelectedIndex = 0 Then td.Style("display") = "none" Else td.Style("display") = "block"
        End If
    End Sub

就像我在评论中写的那样，我设置了每个td id和runat="server"。下拉列表必须为AutoPostBack="true"。

现在，每个SelectedIndexChanged必须绑定您的网格，并在每个创建的行上找到HtmlTableCell，现在，控制（它是td）并根据所选索引显示或隐藏第二个{{ 1}}。但是，在每个td的{{1}}下，我将style置于行之外。

当您启动webapp时，只能看到一行，之后，取决于下拉列表选项。

在此示例中，该表位于第一列（td）中...您必须更改display:block/none;;其中 x 是您的列索引。

更新：你没有定义prog.language所以贝娄代码在Dim td As HtmlTableCell = e.Row.Cells(0).FindControl("tdSecond")（使用在线转换工具从vb.net转换，抱歉我在vb.net中编程）

.e.Row.Cells(x)...

Answer 3

使用下拉列表，您可以使用OnSelectedIndexChanged函数。像这样：

＆＃13;

<asp:DropDownList runat="server" ID="ddlDemo" on SelectedIndexChanged="ddlDemo_SelectedIndexChanged">
<asp:ListItem Value="1">one</asp:ListItem><asp:ListItem Value="2">tow</asp:ListItem>
    </asp:DropDownList>

＆＃13;

并在代码中你可以玩它：

＆＃13;

    Protected Sub ddlDemo_SelectedIndexChanged(sender As Object, e As EventArgs)

        Dim selectedValue As Integer = ddlDemo.SelectedValue

        If ddlDemo.SelectedValue = 1 Then

            ' do something

        End If


    End Sub

＆＃13;

asp.net gridview根据下拉列表选择显示每条记录一行或两行

3 个答案: