Click to See Complete Forum and Search --> : help with .htc file


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.

Yeorwned
March 7th, 2008, 08:57 AM
CSS doesn't know what to do with tags like headerstyle-backcolor and behavior so if the server sends them to client rather that way, the browser will ignore them. If you're hoping to use client behaviors, realize that many browsers still don't support that aspect of DHTML. If you still want to head that route, the following article should help you out.

http://msdn2.microsoft.com/en-us/magazine/cc164033.aspx

flynny1st
March 12th, 2008, 09:29 AM
Thanks for the reply that really helped. In the end i simply used


Sub MyDataGrid_ItemCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles SupplierDataGrid.ItemCreated
e.Item.Attributes.Add("OnMouseOver", "this.style.backgroundColor = 'yellow';")
e.Item.Attributes.Add("OnMouseOut", "this.style.backgroundColor = 'white';")
End Sub


to handle it.

thanks again,

Matt.