如同GridView的编辑功能,在Datalist或Repeater中也可以实现。本文实现的功能就是当点击Datalist或Repeater中的某列,自动出现一文本框,然后在文本框中输入要改成的内容,当光标离开该框后即提交到数据库啦!功能虽实现了,不过朋友给我一建议“若无刷新就更好了”,呵呵......
下面是我的代码,还希望能帮到有需要的朋友。注意:我用到了文本框的TextChanged事件,需要将该文本框的AutoPostBack属性设置为true。
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![ExpandedBlockStart.gif](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
1
<%
@ Page Language
=
"
C#
"
AutoEventWireup
=
"
true
"
CodeFile
=
"
UpdateInDatalist.aspx.cs
"
Inherits
=
"
UpdateInDatalist
"
%>
2
3 <! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
4
5 < html xmlns = " http://www.w3.org/1999/xhtml " >
6 < head runat = " server " >
7 < title > 无标题页 </ title >
8 < script language = " javascript " type = " text/javascript " >
9 function pageOnLoad()
10 {
11 var arrAllTextboxes = document.getElementsByTagName( " input " );
12 for (i = 0 ;i < arrAllTextboxes.length;i ++ )
13 {
14 if (arrAllTextboxes[i].id.indexOf( " TxtProName " ) !=- 1 || arrAllTextboxes[i].id == " TextBox1 " || arrAllTextboxes[i].id == " TxtProductID " )
15 {
16 document.getElementById(arrAllTextboxes[i].id).style.display = " none " ;
17 }
18 }
19 }
20 function labelOnClick(Label1,TxtProName,productID,TxtProductID)
21 {
22 document.getElementById(TxtProductID).value = productID; // the nonce productID which needs to update the productName
23 document.getElementById(Label1).style.display = " none " ; // the label disappear
24 document.getElementById(TxtProName).style.display = " inline " ; // the txt appear
25 document.getElementById(TxtProName).focus();
26 }
27 function TxtboxOnblur(TextBox1,controlTxtID,LblProName)
28 {
29 document.getElementById(LblProName).style.display = " inline " ; // the label appear
30 document.getElementById(controlTxtID).style.display = " none " ; // the txt disappear
31 document.getElementById(TextBox1).value = document.getElementById(controlTxtID).value;
32 }
33 </ script >
34 </ head >
35 < body onload = " pageOnLoad() " >
36 < form id = " form1 " runat = " server " >
37 < asp:TextBox ID = " TextBox1 " runat = " server " ></ asp:TextBox >
38 < asp:TextBox ID = " TxtProductID " runat = " server " ></ asp:TextBox >
39
40 < asp:DataList ID = " DataList1 " runat = " server " HorizontalAlign = " Justify "
41 RepeatColumns = " 3 " RepeatDirection = " Horizontal "
42 onitemdatabound = " DataList1_ItemDataBound " >
43 < ItemTemplate >
44
45 < table >
46 < tr >
47 < td >
48 < asp:Image ID = " Image1 " Width = " 150 " Height = " 120 " ImageUrl = ' <%# "UploadImages/"+Eval("productPic") %> ' runat = " server " />
49 </ td >
50 </ tr >
51 < tr >
52 < td >
53 < asp:Label ID = " Label1 " runat = " server " Text = ' <%#Eval("productName")%> ' ></ asp:Label >
54 < asp:Label ID = " LblProductID " Visible = " false " runat = " server " Text = ' <%#Eval("productID")%> ' ></ asp:Label >
55 < asp:TextBox ID = " TxtProName " AutoPostBack = " True " runat = " server " Text = ' <%#Eval("productName") %> ' ontextchanged = " TxtProName_TextChanged " ></ asp:TextBox >
56 </ td >
57 </ tr >
58 </ table >
59 </ ItemTemplate >
60 </ asp:DataList >
61 </ form >
62 </ body >
63 </ html >
64
2
3 <! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
4
5 < html xmlns = " http://www.w3.org/1999/xhtml " >
6 < head runat = " server " >
7 < title > 无标题页 </ title >
8 < script language = " javascript " type = " text/javascript " >
9 function pageOnLoad()
10 {
11 var arrAllTextboxes = document.getElementsByTagName( " input " );
12 for (i = 0 ;i < arrAllTextboxes.length;i ++ )
13 {
14 if (arrAllTextboxes[i].id.indexOf( " TxtProName " ) !=- 1 || arrAllTextboxes[i].id == " TextBox1 " || arrAllTextboxes[i].id == " TxtProductID " )
15 {
16 document.getElementById(arrAllTextboxes[i].id).style.display = " none " ;
17 }
18 }
19 }
20 function labelOnClick(Label1,TxtProName,productID,TxtProductID)
21 {
22 document.getElementById(TxtProductID).value = productID; // the nonce productID which needs to update the productName
23 document.getElementById(Label1).style.display = " none " ; // the label disappear
24 document.getElementById(TxtProName).style.display = " inline " ; // the txt appear
25 document.getElementById(TxtProName).focus();
26 }
27 function TxtboxOnblur(TextBox1,controlTxtID,LblProName)
28 {
29 document.getElementById(LblProName).style.display = " inline " ; // the label appear
30 document.getElementById(controlTxtID).style.display = " none " ; // the txt disappear
31 document.getElementById(TextBox1).value = document.getElementById(controlTxtID).value;
32 }
33 </ script >
34 </ head >
35 < body onload = " pageOnLoad() " >
36 < form id = " form1 " runat = " server " >
37 < asp:TextBox ID = " TextBox1 " runat = " server " ></ asp:TextBox >
38 < asp:TextBox ID = " TxtProductID " runat = " server " ></ asp:TextBox >
39
40 < asp:DataList ID = " DataList1 " runat = " server " HorizontalAlign = " Justify "
41 RepeatColumns = " 3 " RepeatDirection = " Horizontal "
42 onitemdatabound = " DataList1_ItemDataBound " >
43 < ItemTemplate >
44
45 < table >
46 < tr >
47 < td >
48 < asp:Image ID = " Image1 " Width = " 150 " Height = " 120 " ImageUrl = ' <%# "UploadImages/"+Eval("productPic") %> ' runat = " server " />
49 </ td >
50 </ tr >
51 < tr >
52 < td >
53 < asp:Label ID = " Label1 " runat = " server " Text = ' <%#Eval("productName")%> ' ></ asp:Label >
54 < asp:Label ID = " LblProductID " Visible = " false " runat = " server " Text = ' <%#Eval("productID")%> ' ></ asp:Label >
55 < asp:TextBox ID = " TxtProName " AutoPostBack = " True " runat = " server " Text = ' <%#Eval("productName") %> ' ontextchanged = " TxtProName_TextChanged " ></ asp:TextBox >
56 </ td >
57 </ tr >
58 </ table >
59 </ ItemTemplate >
60 </ asp:DataList >
61 </ form >
62 </ body >
63 </ html >
64
![](https://i-blog.csdnimg.cn/blog_migrate/8f900a89c6347c561fdf2122f13be562.gif)
![ExpandedBlockStart.gif](https://i-blog.csdnimg.cn/blog_migrate/961ddebeb323a10fe0623af514929fc1.gif)
using
System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class UpdateInDatalist : System.Web.UI.Page
{
string sql = null ;
protected void Page_Load( object sender, EventArgs e)
{
if ( ! IsPostBack)
{
BindDataList1();
}
}
void BindDataList1()
{
sql = string .Format( " select * from productTable order by productID desc " );
DataTable dt = DataBase.ExecuteDataSet(sql).Tables[ 0 ];
DataList1.DataSource = dt.DefaultView;
DataList1.DataBind();
}
protected void DataList1_ItemDataBound( object sender, DataListItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
DataRowView drv = (DataRowView)e.Item.DataItem;
string productID = ((Label)e.Item.FindControl( " LblProductID " )).Text.ToString();
((Label)e.Item.FindControl( " Label1 " )).Attributes.Add( " onClick " , " labelOnClick(' " + ((Label)e.Item.FindControl( " Label1 " )).ClientID + " ',' " + ((TextBox)e.Item.FindControl( " TxtProName " )).ClientID + " ',' " + productID + " ',' " + TxtProductID.ClientID + " ') " );
((TextBox)e.Item.FindControl( " TxtProName " )).Attributes.Add( " onBlur " , " TxtboxOnblur(' " + TextBox1.ClientID + " ',' " + ((TextBox)e.Item.FindControl( " TxtProName " )).ClientID + " ',' " + ((Label)e.Item.FindControl( " Label1 " )).ClientID + " ') " );
}
}
protected void TxtProName_TextChanged( object sender, EventArgs e)
{
string productName = TextBox1.Text.ToString();
string productID = TxtProductID.Text.Trim().ToString();
// Response.Write(productID);
sql = string .Format( " update productTable set productName='{0}' where productID={1} " , productName, productID);
int i = DataBase.ExecuteNonQuery(sql);
if (i > 0 )
{
BindDataList1();
}
}
}
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class UpdateInDatalist : System.Web.UI.Page
{
string sql = null ;
protected void Page_Load( object sender, EventArgs e)
{
if ( ! IsPostBack)
{
BindDataList1();
}
}
void BindDataList1()
{
sql = string .Format( " select * from productTable order by productID desc " );
DataTable dt = DataBase.ExecuteDataSet(sql).Tables[ 0 ];
DataList1.DataSource = dt.DefaultView;
DataList1.DataBind();
}
protected void DataList1_ItemDataBound( object sender, DataListItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
{
DataRowView drv = (DataRowView)e.Item.DataItem;
string productID = ((Label)e.Item.FindControl( " LblProductID " )).Text.ToString();
((Label)e.Item.FindControl( " Label1 " )).Attributes.Add( " onClick " , " labelOnClick(' " + ((Label)e.Item.FindControl( " Label1 " )).ClientID + " ',' " + ((TextBox)e.Item.FindControl( " TxtProName " )).ClientID + " ',' " + productID + " ',' " + TxtProductID.ClientID + " ') " );
((TextBox)e.Item.FindControl( " TxtProName " )).Attributes.Add( " onBlur " , " TxtboxOnblur(' " + TextBox1.ClientID + " ',' " + ((TextBox)e.Item.FindControl( " TxtProName " )).ClientID + " ',' " + ((Label)e.Item.FindControl( " Label1 " )).ClientID + " ') " );
}
}
protected void TxtProName_TextChanged( object sender, EventArgs e)
{
string productName = TextBox1.Text.ToString();
string productID = TxtProductID.Text.Trim().ToString();
// Response.Write(productID);
sql = string .Format( " update productTable set productName='{0}' where productID={1} " , productName, productID);
int i = DataBase.ExecuteNonQuery(sql);
if (i > 0 )
{
BindDataList1();
}
}
}