《ASP.NET1200例》高亮显示ListView中的数据行并自动切换图片

aspx

<script type="text/javascript">
var oldColor;
function SetNewColor(Source) {
oldColor = Source.style.backgroudColor;
Source.style.backgroudColor = "#FFCCFF";
}
function SetOldColor(Source) {
Source.style.backgroudColor = oldColor;
}
function ShowPhoto(url) {
document.getElementById("Image1").src= url;
} </script>
<body>
<form id="form1" runat="server">
<div>
<asp:ListView ID="ListView1" runat="server"
onitemdatabound="ListView1_ItemDataBound">
<ItemTemplate>
<table id="myTable" border="" cellpadding="" cellspacing="" runat="server" onmouseover='this.style.backgroundColor="#ff0000"'>
<tr >
<td>
图片ID:
<asp:Label ID="Label1" runat="server" Text=""><%#Eval("id")%></asp:Label>
图片名称: <asp:TextBox ID="txtimageName" runat="server" Text='<%#Eval("imageName")%>'></asp:TextBox>
图片路径: <asp:TextBox ID="txtimageUrl" runat="server" Text='<%#Eval("imageUrl")%>'></asp:TextBox>
</td>
</tr>
</table>
</ItemTemplate>
</asp:ListView> <asp:Image ID="Image1" runat="server" /> <asp:DataPager ID="DataPager1" PagedControlID="ListView1" runat="server">
</asp:DataPager>
</div>
</form>
</body>

aspx.cs

 ShowImageBll ShowImageBll = new BLL.ShowImageBll();
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
bindDL(); }
}
public void bindDL()
{
//绑定数据源
DataSet ds = ShowImageBll.GetList();
ListView1.DataSource = ds;
ListView1.DataBind(); }
protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e)
{
if (e.Item.ItemType == ListViewItemType.DataItem) //判断目前的项目是否为一个数据项目
{
ListViewDataItem curDataItem = (ListViewDataItem)e.Item; //把目前的项目转化为一个ListViewDataItem
DataRowView curRow = (DataRowView)curDataItem.DataItem;//把获取的行转化为DataRowView对象
int id = int.Parse(curRow["id"].ToString());
String imageUrl = ShowImageBll.getImageUrlByID(id);
HtmlTable myTable = (HtmlTable)curDataItem.FindControl("myTable");//获取ItemTemplate模板中的Table控件
myTable.Attributes.Add("onMouseOver", "SetNewColor(this);ShowPhoto('"+imageUrl+"');");
myTable.Attributes.Add("onMouseOut", "SetOldColor(this);ShowPhoto('image/20131129.jpg');");
}
}

总结:
【1】前段HTML的Table控件 定义: <table id="myTable" border="1" cellpadding="5"  cellspacing="0"  runat="server">

  后端获取时:HtmlTable myTable = (HtmlTable)curDataItem.FindControl("myTable");//获取ItemTemplate模板中的Table控件

(此时需要添加引用using System.Web.UI.HtmlControls;)

【2】ListViewDataItem curDataItem = (ListViewDataItem)e.Item; //把目前的项目转化为一个ListViewDataItem
      DataRowView curRow = (DataRowView)curDataItem.DataItem;//把获取的ListViewItem对象所绑定的数据转化为DataRowView对象               
【3】遗留的问题:背景颜色的切换不起作用。函数SetNewColor(this)或者设置在aspx页面内嵌javascript也不起作用

上一篇:【数学】【CF27E】 Number With The Given Amount Of Divisors


下一篇:ios监听ScrollView/TableView滚动的正确姿势