Forms Data Controls :: Fixed / Freezed Headers In Grid
May 25, 2010
I have a gridview that displays a list of records and i have a verical scroll bar on that grid i want the grid headers to be freezed when i am coming to the last record i added css like this
.container table
th {/* Keep the header cells positioned as we scroll */
position:relative;/* Style */
}
color: Black;background:silver;font-weight:
bold;border-bottom:
solid 1px
#CCCCCC;text-align:
left;padding-left:5px;
and after this calling this css class within div tag
<div class="container"
style="height:300px;">
I wanted to have fixed headers in grid view. I came across multiple solutions but none worked with IE 8 and Chrome. One of the best solutions is following:
I want scrollable gridview with fixed header. For that i create belw code
[Code]....
It works fine uptil page loads.I have functionality to delete rows from gridview.Once i click delete button from gridview the width of header columns get decreased then the width od data inside gridview.It means depending on the content of data the size gets variable.HOW to show data inside gridview irrespective of the content of data.
Scrollable GridView with Fixed Headers inside ASP.Net UpdatePanel using jQuery Plugin. I have one more question in that. How to adjust the width of the columns headers because for some of my gridviews the headers not showing the proper format. in the gridview I gave HorizontalAlign="Left" and in the columns I gave
Given all the research I've done, I don't think this is possible - am I correct? I've been all over the web looking for ways to do this. My grid needs to scroll vertically, horizontally, sort, and go into edit mode. I've been able to do the "cheap" solution where a table sits above the grid to hold the column names, but this does not work well with putting the grid into edit mode or scrolling horizontally. In both cases, the columns become out of synch with their headers. My organization will not pay for a grid, so JQGrid is out. So, since the 'expression' capability has been removed from IE8, we are left with no possibilities for fixed column headers?
I'm not advanced enough in JQuery to do this...but wouldn't it be possible to create a JQuery function that copies the grid header row to a div that sits above the grid, so that the headers are always visible? (And hide the original grid header row). Anyone want to take a crack at it? Maybe I'll try but it will probably take me too long.
I am using an ASP.NET ListView control and, at the moment, I have a scrollable grid: (example below is simplified and contains embedded styling for sake of question)
How can you have a fixed header on a DataGrid or GridViw and allow the grid to scroll? I'd like to avoid a solution that uses another separate table for headers.
I have never work with a repeater and after a lot of research I got to the conclusion that this is the control I need to use for what I have to do. I need display data but I will need 2 headers and after some sort of amount of records the headers will repeat again. In this page you will find an example of what I'm trying to do http://ratings.fide.com/view_source.phtml?code=45276 I don't know if a repeater is the right control but i thin it is.
I am working with asp.net tab control currently with two tabs. The first tab is a list of jobs to be worked. The gridview id is "gvJobs". I call the ScrollableGridPlug via
$(document).ready( function () { $('[id*=gvJobs]').Scrollable({ ScrollHeight: 450
[code]...
When i click at the Equip Tab is get a blank gridview. There is a scrollbar on the left side indicating there is data in the gridview; however there is nothing visible. Additionally is there a way to scrollable function when I click on the appropriate tab?
But the problem is that, when the grid is placed inside the "Update panel" and if some button action fired, the scrollable grid with the fixed header is changed to the normal grid.
I have a couple of Textboxes in a Gridview header, mainly used to search for items in the dataset. This works fine; however, on Post Back, the textboxes do not hold the entered text. The View State is enabled for these control items.
I am trying to set the width of each column within my gridview. Problem is that none of it is working. I have tried setting the whole grid view to 100% and then break down each individual column to a certain percentage, tried manually adjusting Header Width, Item Style width, tried setting it in code, I have tried just about everything and the column doesn't want to budge. The only time I can adjust the width of the column/cell is when I do it in SQL, but because they are requesting the tooltip to preview the comment I would like to pursue my options doing it on the page itself.
//Code protected void grdComments_RowDataBound(object sender, GridViewRowEventArgs e) {//Setting the tooltip for the comment column and column width. grdComments.Columns[3].ItemStyle.Width = Unit.Pixel(100); //e.Row.Cells[3].Width = Unit.Pixel(100); e.Row.Cells[3].Wrap = false; e.Row.Cells[3].Style["overflow"] = "hidden"; e.Row.Cells[3].Style["text-overflow"] = "ellipsis"; e.Row.Cells[3].ToolTip = e.Row.Cells[3].Text; }
I am able to put gridview inside asp:panel and scrolling works too. But the moment I down, the header of gridView scrolls above inside the panel and gets hidden.
I just want to scroll rows, not the header. How can I do that?. Following is what I am using.
On a side note, I have tried to wrap gridView in DIV but div doesn't show the scroll bars in the first load for some reason.
I m working on Datagrids and i am trying to specify a fixed width for a Column(in datagrid) ...Is there any property to specify the width of the columns in datagrid(i know its pretty easy to specify the width of the Datagrid but i want to specify the fixed column width) Also how do i specify the text wrapping in a datagrid
