Read Scrollable GridView With Fixed Headers Using CSS if you want to create scrollable fixed header gridview without using jQuery or JavaScript.
First of all add jquery library and fixed header scrollable gridview jquery plugin in project and add reference to it between <head></head> section of HTML source of aspx page.
First of all add jquery library and fixed header scrollable gridview jquery plugin in project and add reference to it between <head></head> section of HTML source of aspx page.
<head runat="server"> <title>jQuery Fixed Header Scrollable GridView</title> <script src="jquery-1.4.1.min.js" type="text/javascript"> </script> <script src="ScrollableGrid.js" type="text/javascript"> </script> </head>
<script type="text/javascript" language="javascript">
$(document).ready(function()
{
$('#<%=fixedHeaderScrollableGridView.ClientID %>').Scrollable();
}
)
</script>
<asp:GridView ID="fixedHeaderScrollableGridView" runat="server"
DataSourceID="SqlDataSource1"
AutoGenerateColumns="False"
DataKeyNames="ProductID"
AllowPaging="True"
PageSize="30">
<Columns>
<asp:BoundField DataField="ProductID" HeaderText="ProductID"/>
<asp:BoundField DataField="ProductName" HeaderText="ProductName" />
<asp:BoundField DataField="QuantityPerUnit" HeaderText="QuantityPerUnit" />
<asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" />
<asp:BoundField DataField="CategoryName" HeaderText="CategoryName" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT [ProductID], [ProductName], [QuantityPerUnit],
[UnitPrice], [CategoryName] FROM [Alphabetical list of products]">
</asp:SqlDataSource>
No comments :
Post a Comment