Gridview height issue - asp.net

This is a simple one but it is defeating me.
Ok, I have a gridview, lovely stuff. I have attempted to set the height of the headers so that the height is maintained regaardless of the content of the gridview.
However, if a data row requires a bit more height itself (to include the data), the height of the heading also increases.
How do I go about ensuring the height of the header is maintained but not at the expense of the data rows themselves?

GridView provides interesting styling features using asp.net tags in grid view, If you want to style height of a header, you can do something like this:
<asp:GridView id='grd' runat='server'>
<HeaderStyle Height="30px"/>
&lt/asp:GridView>
or in headerStyle you can also use CssClass where you can assign the css style class specified.
Hope this helps

I found the reason behind my mysterious expanding rows!!
Bascially, I had set the height of my gridview. When the gridview was full with data and resulted in paging, the heading remained as it should. However, the rows expanded when this gridview was below it's quota of data - essentially .net was being clever and trying to fill the space I had created by setting the height by expanding what it could.
All I did was to remove the height of my gridview and it worked a treat.
Thanks for all the pointers though : )

You can use styles to set almost all presentation attributes. Try out using a css or add style attributes.

Related

How to span the single column in an ASP.NET Gridview HORIZONTALLY

i have a Gridview with a single column which is a template field with an image and a label.
By default, the gridview expands vertically according to the items in the datasource.
But in my case most of the screen space is left unused and the page becomes extremely long.
So it'd be great if the one and only template field automatically becomes a new column (starts again from the top next to it's initial position after a fixed height) or SPANS HORIZONTALLY, not vertically...
i've done some searching and still can't find a solution for this..
any help would be great..!
i took 2 screenshots for a better explanation but the site won't allow me to post images yet :/
I think you are looking for the DataList control. Namely, the RepeatColumns property.

Css For Gridview paging

My question is, can I control the style of the paging element separately of top and bottom, I have set the paging to appear in both top and bottom of the gridview, and I want to see that the top pagination is little high up in the page, to do that I used the cssClass and set margin-top:20px and made the position: absolute, this does change the position of the top paging area and set it rightly for me, but the bottom pagination has also come up as a result and now sits inside the grid data!! Is there any way to solve this?
I suggest that you adjust your CSS, not the style associated with the GridView. Figure out what is causing the space that you want to negate, and eliminate that. Negative css margins is really unnecessary.
If you can't figure out what is causing the space, use FireFox with FireBug. Right click the area, select "Inspect Element". A couple windows will open... one with the html that is selected, and another showing the CSS that is effective in that area.
The solution is to keep a different stylesheet for the bottompagerrow, and I have done it like this in the page load
Dim prow As GridViewRow
prow = GridView1.BottomPagerRow
prow.CssClass = "BottompagerRowStyle"
Since this page will always have data, I did not bother to check for the existence of the bottompager, which can be done additionally

Make an image size equal the size of a table cell in ASP.NET

I have a table, and one of the cells has dynamically generated content.
I want to have a background image that is exactly the same size as the cell. (ie not tiled, but stretched).
I've found a very good reference here, which tells you how to do it in Javascript. This example solves the problem by placing an HTML DIV on the top and the bottom of the cell, then getting Javascript to work out the vertical pixel difference between them.
The biggest problem was that I declare the image as
<asp:Image ID="imgContentsBackground" CssClass="ContentsBackground" runat="server" ImageUrl="~/Images/MoneyColour3.jpg" />
but for some reason ASP.NET arbitrarily renamed the ID from "imgContentsBackground" to "ctl00_imgContentsBackground". Once I hardcoded that ID in the Javascript, the referenced example worked for me.
But I'm thinking - given the rich functionality of ASP.NET, is there a simpler way to determine the size and position of a table cell once the content has been generated, and make an image occupy those dimensions?
if hard-coding the generated name solves it then why don't you try this:
<%= imgContentsBackground.ClientID %>

Discovering row height of autosized GridView row in ASP.NET

I have a number of GridView controls that I need to position side-by-side on a page. For example a GridView containing a list of items in a shopping basket, and a number of GridViews to the side showing pricing from a number of suppliers.
The columns are fixed width in the first GridView - meaning that the row height is variable depending on the amount of text.
So, the question is this - is there any way to discover the individual row heights of the first data-bound GridView such that I can alter the other GridViews to correctly align?
The Row.Height property of the grid after databinding is empty as the height has not been explicity set.
thanks!
I don't know of any way to do this in .Net, you can use javascript, maybe set a .Net hidden field on load if you need it in code behind :
var h = document.getElementsByTagName('td')[0].offsetHeight;
Keep in mind this height will also include any cell padding or spacing you have set. Also, this assumes you're not explicitly setting the height in CSS which based on your question I assume you are not.

How to set columns widths in a GridView control to the widest necessary width

I have a gridview control that can get loaded with multiple pages worth of data. When I switch pages, the columns widths will change to accommodate the largest value in the column for that page.
If possible, I would like to set the widths of each column to the widest necessary width for the entire dataset.
You can set the ItemStyle-Width property on each TemplateField, BoundField, etc. in your gridview to whatever you want. That should hold across paging. You will want to either not set the gridview width, or be sure you don't use a percentage if you do.
If you want to figure this out dynamically, you will have to examine your data first, before binding your grid, figure out the width that you want, then bind your gird and dynamically set the ItemStyle-Width in the RowDataBound event of the gridview.
Tring things, in the edit colum menu of your grid you should try the auto size mode, I configure my to cell and it work pretty well for my needs..
This is available when you are not autogenerating the columns.
Try it.

Resources