JS控制GridView行選擇
阿新 • • 發佈：2018-10-07
color copy cat mar out lan alt trac 沒有 
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
...{
int id = Convert.ToInt32(InstallandMaintanceGrid.DataKeys[e.Row.RowIndex].Value.ToString());
e.Row.Attributes.Add("id", _i.ToString());
e.Row.Attributes.Add("onKeyDown", "SelectRow();");
e.Row.Attributes.Add("onClick", "MarkRow(" + _i.ToString()+","+id + ");");
_i++;
}
<script type="text/javascript">
//雙擊，獲取該行ID
document.getElementById("ctl00_hd_selectedid").value = keys;
}
var currentRowId = 0;
function SelectRow()//選擇行
...{
if (event.keyCode == 40)
MarkRow(currentRowId+1);
MarkRow(currentRowId-1);
}
function MarkRow(rowId,keys)//選中行變色
...{
if (document.getElementById(rowId) == null)
return;
if (document.getElementById(currentRowId) != null )
...{
document.getElementById(currentRowId).style.backgroundColor =‘#ffffff‘;
}
currentRowId = rowId;
document.getElementById(rowId).style.backgroundColor = ‘#ff0000‘;
document.getElementById("ctl00_hd_selectedid").value = keys;
}
</script>
ASP.NET裏的GridView控件使用非常廣泛，雖然其功能強大，但總有一些不盡如人意的地方。
比如在選擇行的時候，它就沒有UltraWebGrid做的友好；UltraWebGrid允許用戶設置是否顯示選擇框，設置允許，則會在最左邊多出一列，表示選擇的行。而GridView則沒有這個功能。但沒有，不代表不能實現，下面我就通過JS來實現行選擇的標識。
後臺代碼：
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)...{ int id = Convert.ToInt32(InstallandMaintanceGrid.DataKeys[e.Row.RowIndex].Value.ToString()); e.Row.Attributes.Add("id", _i.ToString()); e.Row.Attributes.Add("onKeyDown", "SelectRow();"); e.Row.Attributes.Add("onClick", "MarkRow(" + _i.ToString()+","+id + ");"); _i++;}
前臺代碼：
<script type="text/javascript"> function dbClick(keys)...{ //雙擊，獲取該行ID document.getElementById("ctl00_hd_selectedid").value = keys; } var currentRowId = 0; function SelectRow()//選擇行 ...{ if (event.keyCode == 40) MarkRow(currentRowId+1); MarkRow(currentRowId-1); } function MarkRow(rowId,keys)//選中行變色 ...{ if (document.getElementById(rowId) == null) return; if (document.getElementById(currentRowId) != null ) ...{ document.getElementById(currentRowId).style.backgroundColor =‘#ffffff‘; } currentRowId = rowId; document.getElementById(rowId).style.backgroundColor = ‘#ff0000‘; document.getElementById("ctl00_hd_selectedid").value = keys; } </script>
--------------------- 本文來自 zsj830120 的CSDN 博客 ，全文地址請點擊：https://blog.csdn.net/zsj830120/article/details/2408422?utm_source=copy
JS控制GridView行選擇