腾讯云

开发者社区

文档建议反馈控制台

首页

文章/答案/技术大牛

发布

社区首页 >问答首页 >基于下拉列表选择的asp.net网格视图显示每条记录一或两行

问基于下拉列表选择的asp.net网格视图显示每条记录一或两行
EN

Stack Overflow用户

提问于 2015-07-27 06:33:54

回答 3查看 3.1K关注 0票数 0

我有一个asp.net网格视图，它使用下面的代码(示例)为每条记录显示两行。

但是，使用位于页面顶部的下拉列表，基于它的选择(1或2)，我希望网格视图通过以下方式更新自己：

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

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

更新:选择下拉列表选项并使其工作正常，我在那里没有问题，但我需要知道如何操作网格视图以显示每条记录一或两行。因此，基本上，我如何(使用代码)将网格视图的格式从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>

asp.net

gridview

有奖征集｜云上CPU玩转AIGC挑战赛

参加活动赢取洛斐键盘、小米电纸书、智能音响等鹅厂周边！

回答 3

Stack Overflow用户

回答已采纳

发布于 2015-07-27 07:28:59

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

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"。Dropdownlist列表必须有AutoPostBack="true"。

现在，在每个SelectedIndexChanged上都必须绑定您的网格，并且在每个创建的行上查找HtmlTableCell，现在，控制(它是td)并根据选定的索引显示或隐藏第二个td。但是，在style of每一个td中，我将display:block/none;放在行中。

当您启动webapp时，只有一行是可见的，之后，取决于下拉列表的选择。

在本例中，该表位于第一列(Dim td As HtmlTableCell = e.Row.Cells(0).FindControl("tdSecond"))中.您必须更改这个.e.Row.Cells(x)...；其中x是您的列索引。

更新:您没有定义prog.language，所以下面的代码在c#中(使用在线转换工具从vb.net转换而来，对不起，我用vb.net编程)

private void ddlChoice_SelectedIndexChanged(object sender, System.EventArgs e)
{
    grdInfo.DataBind();
}

private void grdInfo_RowCreated(object sender, System.Web.UI.WebControls.GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow) {
        HtmlTableCell td = e.Row.Cells[0].FindControl("tdSecond");
        if (ddlChoice.SelectedIndex == 0)
            td.Style("display") = "none";
        else
            td.Style("display") = "block";
    }
}

票数 1

Stack Overflow用户

发布于 2015-07-27 06:53:52

客户端

一种方法是使用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回发，而客户端解决方案则不会，从而使客户端解决方案更快。

票数 1

Stack Overflow用户

发布于 2015-07-27 06:42:07

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

<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>

在代码中，您可以使用它：

    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