|
 |
| |
รบกวนเกี่ยวกับการแสดงรูปใน datalist ใช้ c# asp.net |
| |
 |
|
|
 |
 |
|
นำข้อมูลจากฐานข้อมูลมาแสดง แสดงข้อมูลได้แล้ว โดยให้แสดงชื่อและรูปภาพ ที่รูปภาพเมื่อเอาเมาส์ไปวางจากรูปที่ 1 จะเปลี่ยนเป็นรูปที่ 2 โดยนำ css มาช่วย รูปภาพสามารถคลิ๊กได้ สามารถคลิ๊กชื่อที่แสดง เมื่อคลิ๊กก็จะโหลดไฟล์ได้ ซึ่งไฟล์นี้เก็บอยู่ในฐานข้อมูลด้วย แต่เนื่องจากข้อมูลมีมากการเขียนโค้ดที่ให้แสดงรูปภาพตามที่ต้องการที่ทำอยู่มันยุ่งยาก
## อยากรู้ว่าสามารถทำให้รูปเปลี่ยนเมื่อเอาเมาส์ไปวาง และเปลี่ยนกลับเมื่อเอาเมาส์ออก //ลองใช้ onmouse แล้วก็ไม่ได้ แล้วเอา css มาก็กลับไปใส่ค่าแบบตรงๆเลย ใส่แบบอื่นไม่ได้
**ถ้าเป็นไปได้อยากรู้วิธีนับจำนวนคนที่โหลดไฟล์ลงในฐานข้อมูลด้วยอะคะ
ฐานข้อมูลมี --- ID , FileName //ชื่อที่แสดง , PicPath1 เก็บพาทรูปที่1 ,PicPath2 //เก็บพาทรูปที่2 ,WordPath //เก็บพาทเอกสารที่ให้โหลด ,countN //นับจำนวนที่โหลด
อันนี้เป็น css ที่ใช้เปลี่ยนเป็นอีกรูปนึงเมื่อเอาเมาส์ไปวาง แต่ที่ทำมันมีรูปมากกว่านี้ ก็เลยเขียนแบบนี้ซ้ำๆ เปลี่ยนตามรูปที่มี
Code
.imghover1 {
display: block;
width: 160px;
height: 160px;
background: url('Images/icon_flowchart.png');
text-indent: -99999px;
}
.imghover1:hover {
background-image : url('Images/icon_flowchart2.png');
}
.imghover2 {
display: block;
width: 160px;
height: 160px;
background: url('Images/result.png');
text-indent: -99999px;
}
.imghover2:hover {
background-image : url('Images/result2.png');
}
อันนี้ให้แสดงข้อมูล ก็เขียนยาวๆ เหมือนที่ทำใน css
Code (C#)
void myDataList_ItemDataBound(Object sender, DataListItemEventArgs e)
{
Image img = (Image)(e.Item.FindControl("FilePath"));
if (img != null)
{
img.ImageUrl = (string)DataBinder.Eval(e.Item.DataItem, "PicPath1");
if (img.ImageUrl == "Images/icon_flowchart.png")
{
img.ImageUrl = null;
img.CssClass = "imghover1";
}
if (img.ImageUrl == "Images/result.png")
{
img.ImageUrl = null;
img.CssClass = "imghover2";
}
HyperLink hplCate = (HyperLink)(e.Item.FindControl("hplPicWeb"));
if (hplCate != null)
{
hplCate.Text = (string)DataBinder.Eval(e.Item.DataItem, "FileName");
hplCate.ToolTip = (string)DataBinder.Eval(e.Item.DataItem, "FileName");
hplCate.NavigateUrl = DataBinder.Eval(e.Item.DataItem, "WordPath").ToString();
}
}
<asp:DataList ID="myDataList" onItemDataBound="myDataList_ItemDataBound" RepeatColumns="4" runat="server" align="center" RepeatDirection="Horizontal">
<ItemTemplate>
<div style="width:200px" align="center">
<a href="<%#Eval("WordPath") %>">
<asp:Image id="FilePath" runat="server" width="160" height="160"></asp:Image></a>
<br/>
<asp:HyperLink id="hplPicWeb" runat="server" target="_blank"></asp:HyperLink>
<br/>
</div>
</ItemTemplate>
<SeparatorTemplate>
<hr />
</SeparatorTemplate>
</asp:DataList>
Tag : .NET, Ms SQL Server 2012, Web (ASP.NET), C#
|
ประวัติการแก้ไข
2016-02-24 09:27:32
|
 |
 |
 |
 |
| Date :
2016-02-24 08:54:42 |
By :
catty |
View :
979 |
Reply :
3 |
|
 |
 |
 |
 |
|
|
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
ลอง View Source ในหน้า Web Browser ดูครับ มัน Assign Path ได้ถูกหรือเปล่า
|
| |
|
|
| |
| Date :
2016-02-24 13:23:58 |
By :
mr.win |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
มันไม่ขึ้นรูปให้เลยอะคะ พอจะมีตัวอย่าง css มั้ยคะ
|
| |
|
|
| |
| Date :
2016-02-24 14:22:52 |
By :
Catty |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอวิธีอื่นก็ได้คะ ที่ใช้แสดงรูปจากฐานข้อมูล เมื่อเอาเมาส์ไปวางจะเปลี่ยนเป็นอีกรูปนึง
|
| |
|
|
| |
| Date :
2016-02-25 13:41:53 |
By :
Catty |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 05
|
