在DataList中显示/隐藏div

Question

我想在LinkBut​​ton.Both上切换Gridview是在Datalist ItemTemplate.Kindly帮助

   <asp:DataList ID="dl_newtabs" runat="server" RepeatDirection="Vertical">
    <ItemTemplate>
   <div class="solution_footer">
   <asp:LinkButton ID="lnk_tabnew" runat="server" Text='<%# Eval("service_name") %>'
    CommandArgument='<%# Eval("service_name")  %>' OnClick="lnk_tabnewclick"  CssClass="toggdiv"></asp:LinkButton>
   </div>
    <div id="Div1" style="max-height: 300px; overflow-y: scroll; float: left;   width: 100%;" >
   <asp:Gridview id ="grddesc" runat="server">
  </asp:Gridview>
  </div>

   </asp:DataList>

这就是我到目前为止所做的，点击LinkBut​​ton。         

    $(document).ready(function () {
        $(".Div1").hide();
        $(".solution_footer").click(function () {
            $(this).nextAll('div[class="Div1"]').eq(0).slideToggle(100);
        });
    });

Answer 1

JS：

function lnk_tabnewclick(){
    $('#grddesc').toggleClass('hidden');
}

我刚刚使用了您已在此处on click点击的点击事件...如果需要，请进行更改。

<强> CSS：

.hidden{ display: none }

<强> HTML：

   <asp:Gridview id ="grddesc" runat="server" class="hidden">

或者，如果您要将显示/隐藏应用于包含<div>：

<div id="Div1" class="hidden"></div>

如果您希望首先隐藏gridview，请将该类保留在那里。如果没有，请删除隐藏的类，它将在点击时应用。

Answer 2

您正在使用

<div id="Div1" style="max-height: 300px; overflow-y: scroll; float: left;   width: 100%;" >

Div1不是“类”，而是“id”

尝试将其更改为

<div class="Div1" style="max-height: 300px; overflow-y: scroll; float: left;   width: 100%;" >

$(document).ready(function () {
        $(".Div1").hide();
        $(".solution_footer").click(function () {
            $(this).nextAll('div[class="Div1"]').eq(0).slideToggle(100);
        });
    });