C# .NET - how to keep scrollbar for repeater in asp.net?

Asked By deepi singh
26-Dec-11 08:13 AM
how to keep scrollbar for repeater in asp.net?
  Suchit shah replied to deepi singh
26-Dec-11 08:19 AM
Place repeater control inside a div tag

<div style="width:980px; overflow:scroll; height:500px">
<repeater>
</div>
You need to keep the repeater control inside a div tag, which will add the scroll bar to the repeater control.

Check the below link for the samples

http://www.dotnetspider.com/resources/2301-Scrollable-Repeater-control-with-fixed-column-Header-Auto-Scrollbar.aspx 
  Vickey F replied to deepi singh
26-Dec-11 08:20 AM
Try like this-

put your repeater control inside div.

<div style="width: 200px; height: 50px; overflow: auto">

your repeater control

</div>
  Suchit shah replied to deepi singh
26-Dec-11 08:22 AM
Example of it given below
you put in th page an empty div and under it you draw the repeater inside a div tag that has overflow : 

<div id="tableHeader"></div>
<div style="overflow: scroll; height:500px; width:500px">
<div>
<asp:Repeater ID="myReapeter" runat="server">
<HeaderTemplate>
<table id="table" width="500" style="table-layout:fixed;">
<thead>
<tr id="thead" style=" width: 500px; top: 12px;table-layout:fixed;">
<th class="txt" style="padding-left: 10px;background-color: #dedede;">
Name</th>
<th class="txt" style="padding-left: 10px;background-color: #dedede;">
Group</th>
<th class="txt" style="padding-left: 10px;background-color: #dedede;">
Description</th>
</tr>
</thead>
</HeaderTemplate>
<ItemTemplate>
...
</div>



Don' forget to add style to the table, particullary table-layout:fixed;
You must have these tags also because we are going to use them :<thead></thead>

Inside the <ItemTemplate> Tags you draw the content you get from the database.

The Table Header will stay outside the div with overflow:scroll if you use this little javascript code: 

<script type="text/javascript">
function fixHeader()
{
var t = document.getElementById("table");
var thead = t.getElementsByTagName("thead")[0];
var t1 = t.cloneNode(false);
t1.appendChild(thead);
tableHeader.appendChild(t1)
}
window.onload = fixHeader
</script>



http://www.dotnetspider.com/resources/2301-Scrollable-Repeater-control-fixed-column-Header.aspx 
  dipa ahuja replied to deepi singh
26-Dec-11 08:44 AM
Take a panel inside the scrollbar and enable the scrollbar

<ItemTemplate>

<asp:Panel ScrollBars="Vertical" ID="Panel1" runat="server">
</asp:Panel>

</ItemTemplate>

Create New Account
help
asp:hyperlink window properties Hi All: I have an asp.net page with repeater. inside it I have a item template. I have a Hyper link : <asp:HyperLink ID to open in new window and want that newly opened window is without toolbar and scrollbar. but I m getting error. Regards, Asif Hameed setting NavigateUrl will set href attribute of anil: I tried this code. It opens two windows. one for JavaScript and one using asp.net. <asp:HyperLink ID = "hpErrorDetails" runat = "server" Visible = "false" NavigateUrl = "#"> Details . . .< / asp:HyperLink> hpErrorDetails.Attributes.Add
Webpage Space Problem ASP.NET in my web appln i have successufully created my project buti have 1 problem the 4. when u don't want to sort / paging data when u display it Use Repeater Instead of GridView 5. Validate your code with W3C 6. Optimize Images for Web using in right handside so much of empty space is showing here. . . in bottom it show scrollbar it webpage size is so big. . . i want to reduce the page how ? oh then
horizontal and vertical scroll bar with fixed header in repeater contr horizontal and vertical scroll bar with fixed header in repeater control? see this below link http: / / www.dotnetspider.com / resources / 2301-Scrollable-Repeater-control-with-fixed-column-Header-Auto-Scrollbar.aspx where i have to call tht synHeader function call ? Try this CSS for Header style type = "text / css"> .header { font-weight:bold; position:absolute; background-color:White; } < / style> <asp:Repeater id = "Repeater1" runat = "server" > <HeaderTemplate CssClass = "header" Height = "20px" > <table border = "1" > < / HeaderTemplate> - -- -- -- -- -- - - -- -- -- -- -- - Try this Stylesheet: .Freezing { position:relative ; top:expression(this.offsetParent.scrollTop); z-index: 10; } follow http: / / forums.asp.net / t / 1028152.aspx < script type = "text / javascript" language = "javascript" > function fixHeader() { var t = document.getElementById onload = fixHeader < / script > http: / / dotnetslackers.com / Community / blogs / kaushalparik / archive / 2008 / 06 / 28 / vertically-scrollable-repeater-with-fixed-headers.aspx I master page also you can write CSS, on top of
asp.net ASP.NET hi, how gridiview is used in uploading multiple images in asp.net check this link. . . http: / / weblogs.asp.net / imranbaloch / archive / 2010 / 04 / 03 / image-preview-in-asp-net-mvc.aspx Create New Account