You are on page 1of 2

<script src="~/Scripts/jquery-1.4.1.min.

js" type="text/javascript"></script>
<script src="~/Scripts/ScrollableGridViewPlugin_ASP.NetAJAXmin.js" type="tex
t/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#<%=GridView1.ClientID %>').Scrollable({
ScrollHeight: 300,
});
});
</script>
.page
{
width: 960px;
background-color: #fff;
margin: 20px auto 0px auto;
border: 1px solid #496077;
}
.main
{
padding: 0px 12px;
margin: 12px 8px 8px 8px;
min-height: 620px;
}

1. Define Your GridView as


<asp:Panel ID="Panel1" runat="server" Height="200px" Width="200px" ScrollBars="
Vertical">
<asp:GridView ID="GridView1" runat="server" RowStyle-VerticalAlign="Bottom"
OnRowDataBound="GridView1_RowDataBound">
<HeaderStyle CssClass="header" Height="20px" />
</asp:GridView>
</asp:Panel>
2. Create a style as
<style type="text/css">
.header
{
font-weight:bold;
position:absolute;
background-color:White;
}
</style>
3. Add Following code at RowDataBound Event of GridView
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As GridView
RowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.RowIndex = 0 Then
e.Row.Style.Add("height", "40px")
End If
End If
End Sub

-----------------------------------------------------------------------------------------------------Alternativelyyou can simply do this tooo


<asp:Panel ID="Panel1" runat="server" BorderStyle="Ridge" BorderWidth="2" Scro
llBars="Vertical" Width="850" Height="520px" horizontalAlign="NotSet" >
<asp:GridView ID="GridView1" runat="server" >
</asp:GridView>
</asp:Panel>

You might also like