.net dataGridView当鼠标经过时当前行背景色变色;然后【给GridView增加单击行事件,并获取单击行的数据填充到页面中的控件中】...
1.首先在前台dataGridview属性中增加onRowDataBound属性事件
2.然后在后台Observing_RowDataBound事件中增加代码
protected void Observing_RowDataBound(object sender, GridViewRowEventArgs e)
{
//首先判断是否是数据行
if (e.Row.RowType == DataControlRowType.DataRow)
{
//当鼠标停留时更改背景色
e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#eed6d6'");
//当鼠标移开时还原背景色
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c");
}
}
此随笔参考原文 http://www.cnblogs.com/Ryan_j/archive/2010/10/04/1842038.html GridView72般绝技
3.下面是自己增加的内容【给GridView增加单击行事件,并获取单击行的数据填充到页面中的控件中】
e.Row.Attributes.Add("onclick", "getGridViewValue('" + strName + "','" + strSex + "','" + strAge + "','" + Server.UrlEncode(strDiag).Replace("+", "%20") + "')");
strDiag诊断这个字段有可能会出现有空格的现象,如果有空格,不编码传到前台js会报错,所以这里要编码。而vs编码后空格就会变成+号,所以这里要用Server.UrlEncode编码后并将+号替换为%20,前台js中接收并解码就成功了,单击GridView填充数据到Textbox控件中。
【最后附上代码】
【后台】
1 protected void Observing_RowDataBound(object sender, GridViewRowEventArgs e) 2 { 3 4 //首先判断是否是数据行 5 if (e.Row.RowType == DataControlRowType.DataRow) 6 { 7 //当鼠标停留时更改背景色 8 e.Row.Attributes.Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#eed6d6'"); 9 //当鼠标移开时还原背景色 10 e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=c"); 11 int index = e.Row.DataItemIndex; 12 DataTable dt = (DataTable)ObservingGrid.DataSource; 13 string strName = dt.Rows[index][2].ToString(); 14 string strSex = dt.Rows[index][3].ToString(); 15 string strAge = dt.Rows[index][4].ToString(); 16 string strDiag = dt.Rows[index][5].ToString(); 17 //DY.Web.UI.Dialog.LhgDialog.Alert(this, "getGridViewValue('" + strName + "','" + strSex + "','" + strAge + "','" + Uri.EscapeDataString(strDiag) + "')", ""); 18 e.Row.Attributes.Add("onclick", "getGridViewValue('" + strName + "','" + strSex + "','" + strAge + "','" + Server.UrlEncode(strDiag).Replace("+", "%20") + "')"); 19 20 } 21 22 }
【js】
1 <script type="text/javascript"> 2 function getGridViewValue(name, sex, age, diag) { 3 document.getElementById("TbName").value = name; 4 document.getElementById("DdlbSex").value = sex; 5 document.getElementById("TbAge").value = age; 6 document.getElementById("TbDiagnosis").value = decodeURI(diag); 7 } 8 </script>