473,320 Members | 2,071 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

DataGrid header style inconsistent with sortable column style

I just wrote code to support sortable columns in a datagrid.
It seems to work fine; but, it doesn't look right.
The problem is that I have a generic style for links
and a different style for the header row - and they conflict.
The sortable column apparently uses the generic style for <a>
elements and the rest of the header uses "headerRow".

Can anyone tell me how to get consistent styles for each column in
my datagrid header?

Thanks,
Chuck

Here are some of the details:

<asp:DataGrid id="dgPrescriptions" runat="server"
AutoGenerateColumns="False"
<HeaderStyle CssClass="headerRow"></HeaderStyle>

Here's an example of a sortable column:
<asp:BoundColumn HeaderText="Prescription Formula"
DataField="FormulaName" SortExpression="FormulaName"
HeaderStyle-Width="35%" ItemStyle-Width="35%"
FooterStyle-Width="35%"></asp:BoundColumn>

and a non-sortable column:
<asp:BoundColumn HeaderText="Grams per Dose"
DataField="GramsPerDose" ItemStyle-HorizontalAlign="Right"
DataFormatString="{0:F1}" HeaderStyle-Width="6%" ItemStyle-Width="6%"
FooterStyle-Width="6%"
HeaderStyle-HorizontalAlign="Right"></asp:BoundColumn>

and the relavant styles:

a
{
font-family: Times New Roman;
color: #336600;
}

..headerRow {
font-family: 'helvetica','Times New Roman','verdana','sans-serif';
font-weight : bold;
font-size: 10pt;
color: white;
background-color: #669933;
vertical-align: bottom;
}

I thought that adding a class specific style, "a.headerRow",
would help; but, apparently it didn't work:

a.headerRow
{
font-family: 'helvetica','Times New Roman','verdana','sans-serif';
color: White;
}

So, I attempted to override the font family and color in the
code-behind file:

me.dgPrescriptions.HeaderStyle.ForeColor = Color.White
' This is my attempt to last? attempt to override the style
for link elements
' used to implement the sortable column controls to match
the other header labels
me.dgPrescriptions.HeaderStyle.Font.Name = "helvetica"

Unfortunately, this doesn't seem to work either
(although it looks like it should).

Here's what was generated for Firefox:

<tr class="headerRow">
<td width="2%"><font face="helvetica"
color="White">&nbsp;</font></td><td width="35%"><font face="helvetica"
color="White"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl0',' ')"><font
color="White">Prescription Formula</font></a></font></td><td
width="15%"><font face="helvetica" color="White"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl1',' ')"><font
color="White">Patient Name</font></a></font></td><td width="10%"><font
face="helvetica" color="White"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl2',' ')"><font
color="White">Date Entered</font></a></font></td><td width="7%"><font
face="helvetica" color="White"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl3',' ')"><font
color="White">Status</font></a></font></td><td width="7%"><font
face="helvetica" color="White"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl4',' ')"><font
color="White">Encapsulated</font></a></font></td><td align="Right"
width="6%"><font face="helvetica" color="White">Grams per
Dose</font></td><td align="Right" width="6%"><font face="helvetica"
color="White">Doses per Day</font></td><td align="Right"
width="6%"><font face="helvetica" color="White">Number of
Days</font></td><td align="Right" width="6%"><font face="helvetica"
color="White">Total Grams</font></td>

</tr>

and here's what was generated for IE:

<tr class="headerRow" style="color:White;font-family:helvetica;">
<td style="width:2%;">&nbsp;</td><td style="width:35%;"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl0',' ')"
style="color:White;">Prescription Formula</a></td><td
style="width:15%;"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl1',' ')"
style="color:White;">Patient Name</a></td><td style="width:10%;"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl2',' ')"
style="color:White;">Date Entered</a></td><td style="width:7%;"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl3',' ')"
style="color:White;">Status</a></td><td style="width:7%;"><a
href="javascript:__doPostBack('PrescriptionLibrary 1$PrescriptionGrid1$dgPrescriptions$_ctl1$_ctl4',' ')"
style="color:White;">Encapsulated</a></td><td align="Right"
style="width:6%;">Grams per Dose</td><td align="Right"
style="width:6%;">Doses per Day</td><td align="Right"
style="width:6%;">Number of Days</td><td align="Right"
style="width:6%;">Total Grams</td>
</tr>

Nov 19 '05 #1
0 2599

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: Brett P. | last post by:
Hello, I am trying to have only one column sortable within a data grid. I know you set the allow sorting property to true on the style, but this enables sorting for all columns. Is there a way...
1
by: Webgour | last post by:
Hi, I'm tring to add a column to a datagrid with a linkbutton as header that can be used to sort the column. The column and the linkbutton are added programmatically (see below). However the...
3
by: Ben | last post by:
Hi, I'm wondering how can i change the datagrid header text at runtime so that it keeps the sorting enabled? I can do; e.Item.Cells.Text = "foo"; But then foo is the text of the table cell...
2
by: Diffident | last post by:
Hello All, I would like to set css class for datagrid's sortable columns. I cannot do it in the datagrid's header's CSSClass. Datagrid's sortable column headings are generated as <a> tags for...
11
by: rkbnair | last post by:
I have created a datagrid in my aspx with the 'AllowSorting' property to true. When clicking on the column header, the page refreshes. However the sorting is not done. Am I missing anything? I...
3
by: Mortar | last post by:
i would like my datagrids to be both sortable and pageable. All the examples i have found so far use methods which require the datagrid's enableViewState method set to true. This can be bad if the...
3
by: TPhelps | last post by:
I have a sample of an unbound (autogeneratecolumns is true) sortable/pagable datagrid that works. I want to change one of the columns to a hyperlink. The examples I find use a bound column. I...
3
by: rn5a | last post by:
A DataGrid has the following TemplateColumn: <asp:DataGrid ID="dgCart"...OnSortCommand="SortGrid" AllowSorting="true"....> <Column> <asp:TemplateColumn HeaderImageUrl="Images\Up.gif"...
2
by: gnewsgroup | last post by:
I have a GridView, in which the header of one column changes depending on the selected value of a DropDownList outside of this GridView. I did this dynamic header through protected void...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.