flynny1st
March 7th, 2008, 05:53 AM
hi, i have a gatagrid with one column. I want to highlight the column (changed the background colour) when the user mouse rolls over it. I have the following code buts it not working can anyone tell me why please?
************************************************************************
.css
************************************************************************
<head runat="server" />
<style type="text/css"/>
.datagrid
{
Font-Size: "12pt";
width: 150px;
bordercolor: "white";
HeaderStyle-BackColor: "#0099CC";
bordercolor: "white"; font-style:normal; font-variant:normal; font-weight:normal
}
.DataGridTable
{
behavior:url(rollover.htc);
}
.DataGridHeaderStyle {
Background-color:#0099CC;
Font-Size:12pt;
Font-Family:Arial;
color:white;
bordercolor:white;
text-align:left;
}
.ColumnItem {
width:150px;
Background-color:white;
font-family:Arial;
font-size:12px;
text-align:left;
color:white;
bordercolor:#0099CC;
behavior:url(rollover.htc);
}
a:link { color:#0099CC;}
a:visited { color:#0099CC;}
a:hover {color:darkblue; }
</style>
************************************************************************
.htc ( is in the same folder as the css file (App_Themes/Themes)
************************************************************************
<PUBLIC:COMPONENT>
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilight()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="Restore()" />
<SCRIPT LANGUAGE="JScript">
var normalColor;
function Hilight() {
normalColor = currentStyle.backgroundColor;
runtimeStyle.backgroundColor = "#FFFF66";
}
function Restore() {
runtimeStyle.backgroundColor = normalColor;
}
</SCRIPT>
</PUBLIC:COMPONENT>
************************************************************************
apsx file
************************************************************************
<%@ Page Language="VB" AutoEventWireup="True" Theme="Theme"%>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.Odbc" %>
<%@ Import Namespace="System.Data.SQLClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head id="Head1" runat="server">
<script runat="server">
Protected Shared Function getConnectionString() As String
'Pass the connectionstring in the appsettings of the web.config file
Return ConfigurationManager.AppSettings("Connectionweb")
End Function
Function CreateDataSource() As DataSet
Dim oQRY = "SELECT supplierID, name FROM suppliers"
Dim oDataAdapter As ODBCDataAdapter
Dim oDataSet As DataSet = new DataSet()
oDataAdapter = New ODBCDataAdapter(oQRY, getConnectionString())
oDataAdapter.Fill(oDataSet)
Return oDataSet
End Function
Sub Page_Load(sender As Object, e As EventArgs)
MyDataGrid.DataSource = CreateDataSource()
MyDataGrid.DataBind()
End Sub
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:DataGrid id="MyDataGrid"
AutoGenerateColumns="false"
runat="server">
<HeaderStyle CssClass ="DataGridHeaderStyle"></HeaderStyle>
<Columns>
<asp:HyperLinkColumn
ItemStyle-CssClass ="ColumnItem"
HeaderText="Manufacturers"
DataNavigateUrlField="supplierID"
DataNavigateUrlFormatString="detailspage.aspx?id={0}"
DataTextField="name"
DataTextFormatString="{0:c}"
Target="_blank">
<ItemStyle CssClass="ColumnItem"></ItemStyle>
</asp:HyperLinkColumn>
</Columns>
</asp:DataGrid>
</form>
</body>
</html>
just to add in visual web developer 2008 i get the following error message now in the css file
Error 1 Validation (CSS 2.1): 'behavior' is not a known CSS property name.
any ideas?
matt.
************************************************************************
.css
************************************************************************
<head runat="server" />
<style type="text/css"/>
.datagrid
{
Font-Size: "12pt";
width: 150px;
bordercolor: "white";
HeaderStyle-BackColor: "#0099CC";
bordercolor: "white"; font-style:normal; font-variant:normal; font-weight:normal
}
.DataGridTable
{
behavior:url(rollover.htc);
}
.DataGridHeaderStyle {
Background-color:#0099CC;
Font-Size:12pt;
Font-Family:Arial;
color:white;
bordercolor:white;
text-align:left;
}
.ColumnItem {
width:150px;
Background-color:white;
font-family:Arial;
font-size:12px;
text-align:left;
color:white;
bordercolor:#0099CC;
behavior:url(rollover.htc);
}
a:link { color:#0099CC;}
a:visited { color:#0099CC;}
a:hover {color:darkblue; }
</style>
************************************************************************
.htc ( is in the same folder as the css file (App_Themes/Themes)
************************************************************************
<PUBLIC:COMPONENT>
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilight()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="Restore()" />
<SCRIPT LANGUAGE="JScript">
var normalColor;
function Hilight() {
normalColor = currentStyle.backgroundColor;
runtimeStyle.backgroundColor = "#FFFF66";
}
function Restore() {
runtimeStyle.backgroundColor = normalColor;
}
</SCRIPT>
</PUBLIC:COMPONENT>
************************************************************************
apsx file
************************************************************************
<%@ Page Language="VB" AutoEventWireup="True" Theme="Theme"%>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.Odbc" %>
<%@ Import Namespace="System.Data.SQLClient" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head id="Head1" runat="server">
<script runat="server">
Protected Shared Function getConnectionString() As String
'Pass the connectionstring in the appsettings of the web.config file
Return ConfigurationManager.AppSettings("Connectionweb")
End Function
Function CreateDataSource() As DataSet
Dim oQRY = "SELECT supplierID, name FROM suppliers"
Dim oDataAdapter As ODBCDataAdapter
Dim oDataSet As DataSet = new DataSet()
oDataAdapter = New ODBCDataAdapter(oQRY, getConnectionString())
oDataAdapter.Fill(oDataSet)
Return oDataSet
End Function
Sub Page_Load(sender As Object, e As EventArgs)
MyDataGrid.DataSource = CreateDataSource()
MyDataGrid.DataBind()
End Sub
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:DataGrid id="MyDataGrid"
AutoGenerateColumns="false"
runat="server">
<HeaderStyle CssClass ="DataGridHeaderStyle"></HeaderStyle>
<Columns>
<asp:HyperLinkColumn
ItemStyle-CssClass ="ColumnItem"
HeaderText="Manufacturers"
DataNavigateUrlField="supplierID"
DataNavigateUrlFormatString="detailspage.aspx?id={0}"
DataTextField="name"
DataTextFormatString="{0:c}"
Target="_blank">
<ItemStyle CssClass="ColumnItem"></ItemStyle>
</asp:HyperLinkColumn>
</Columns>
</asp:DataGrid>
</form>
</body>
</html>
just to add in visual web developer 2008 i get the following error message now in the css file
Error 1 Validation (CSS 2.1): 'behavior' is not a known CSS property name.
any ideas?
matt.