扩展GridView控件(1) - 鼠标经过行时改变行的样式

GridView既强大又好用。为了让它更强大、更好用，我们来写一个继承自GridView的控件。

[索引页]

[源码下载]

扩展GridView控件(1) - 鼠标经过行时改变行的样式

作者：webabcd

/*正式版的实现 开始*/

介绍

扩展GridView控件：

鼠标经过行的时候改变该行的样式，鼠标离开行的时候恢复该行的样式

使用方法（设置属性）：

MouseOverCssClass - 鼠标经过行时行的 CSS 类名

关键代码

var yy_sgv_originalCssClassName = ''; // 初始样式

function yy_sgv_changeMouseOverCssClass(obj, cssClassName)

[ToolboxData(@"<{0}:SmartGridView runat='server'></{0}:SmartGridView>")]

public class SmartGridView : GridView

private string _cssClassMouseOver;

[Browsable(true)]

[Description("鼠标经过的样式 CSS 类名")]

[DefaultValue("")]

[Category("扩展")]

public virtual string CssClassMouseOver

3、重写OnRowDataBound实现鼠标经过行时改变行的样式的功能。主要是给<tr>增加onmouseover事件和onmouseout事件。

protected override void OnRowDataBound(GridViewRowEventArgs e)

控件使用

添加这个控件到工具箱里，然后拖拽到webform上，设置其CssClassMouseOver属性即可

aspx文件
<yyc:SmartGridView ID="sgvList" runat="server">

</yyc:SmartGridView>

css文件

.over

skin文件

<yyc:SmartGridView runat="server" CssClassMouseOver="over">

</yyc:SmartGridView>

注：其实最好的实现办法应该如下，但是因为之后我针对GridView扩展的其他功能可能会与此有冲突，所以没这么用。

public SmartGridView()

void SmartGridView_PreRender(object sender, EventArgs e)

protected override void OnRowDataBound(GridViewRowEventArgs e)

{

if (e.Row.RowType == DataControlRowType.DataRow)

{

// _cssClassMouseOver不是空则执行

if (!string.IsNullOrEmpty(this._cssClassMouseOver))

{

e.Row.Attributes.Add("onmouseover", "yy_RowClass=this.className;this.className='" + _cssClassMouseOver + "'");

e.Row.Attributes.Add("onmouseout", "this.className=yy_RowClass");

}

}

base.OnRowDataBound(e);

}

/*测试版的实现 结束*/

OK

[源码下载]