Animating GridView with jQuery in ASP.NET -
i have button on home page... onclick i'm getting data database , binding gridview. want "slidedown" gridview on buttonclick. code:
$(document).ready(function() { $("#showallrecordsbtn").click(function() { $("#gridview1").slidedown(100); }); });
and have gridview:
<asp:gridview id="gridview1" runat="server" cellpadding="4" gridlines="none" style="z-index: 1; left: 65px; top: 93px; position: absolute; height: 180px; width: 304px" autogenerateeditbutton="false" autogeneratecolumns="false" autogeneratedeletebutton="true" datakeynames="empid" onrowdeleting="gridview1_rowdeleting1" onrowcommand="gridview1_rowcommand" forecolor="#333333"> <rowstyle backcolor="#eff3fb" /> <footerstyle backcolor="#507cd1" forecolor="white" font-bold="true" /> <pagerstyle backcolor="#2461bf" forecolor="white" horizontalalign="center" /> <selectedrowstyle backcolor="#d1ddf1" font-bold="true" forecolor="#333333" /> <headerstyle backcolor="#507cd1" font-bold="true" forecolor="white" /> <editrowstyle backcolor="#2461bf" /> <alternatingrowstyle backcolor="white" /> <columns> <asp:templatefield> <headertemplate> <asp:label runat="server" text="id"></asp:label> </headertemplate> <edititemtemplate> <asp:textbox id="txtempid" runat="server" readonly="true" text='<%#eval("empid") %>'></asp:textbox> </edititemtemplate> <itemtemplate> <asp:label id="txtempid" runat="server" text='<%#eval("empid") %>'></asp:label> </itemtemplate> </asp:templatefield> <asp:templatefield> <headertemplate> <asp:label id="label2" runat="server" text="name"></asp:label> </headertemplate> <edititemtemplate> <asp:textbox id="txtempname" runat="server" text='<%#eval("empname") %>'></asp:textbox> </edititemtemplate> <itemtemplate> <asp:label id="txtempname" runat="server" text='<%#eval("empname")%>'></asp:label> </itemtemplate> </asp:templatefield> <asp:templatefield> <headertemplate> <asp:label id="label3" runat="server" text="address"></asp:label> </headertemplate> <edititemtemplate> <asp:textbox id="txtempadd" runat="server" text='<%#eval("empadd") %>'></asp:textbox> </edititemtemplate> <itemtemplate> <asp:label id="txtempadd" runat="server" text='<%#eval("empadd")%>'></asp:label> </itemtemplate> </asp:templatefield> <asp:templatefield> <headertemplate> <asp:label id="label4" runat="server" text="age"></asp:label> </headertemplate> <edititemtemplate> <asp:textbox id="txtempage" runat="server" text='<%#eval("empage") %>'></asp:textbox> </edititemtemplate> <itemtemplate> <asp:label id="txtempage" runat="server" text='<%#eval("empage")%>'></asp:label> </itemtemplate> </asp:templatefield> <asp:templatefield> <itemtemplate> <asp:button id="btnselect" runat="server" text="select" commandname="select" commandargument='<%#eval("empid") %>' /> </itemtemplate> </asp:templatefield> </columns> </asp:gridview>
the "slidedown" doesn't take effect! why?
keep gridview inside div tag , try animate. because id of serversidecontrol in case <asp:gridview>
changed when page rendered.
<div id="divgrid"> <asp:gridview> </asp:gridview> </div> $("#showallrecordsbtn").click(function() { $("#divgrid").slidedown(100); });
Comments
Post a Comment