Datalist或Repeater里点击某列内容将放到文本框中以便编辑，文本框失去焦点后信息即可修改成功

如同GridView的编辑功能，在Datalist或Repeater中也可以实现。本文实现的功能就是当点击Datalist或Repeater中的某列，自动出现一文本框，然后在文本框中输入要改成的内容，当光标离开该框后即提交到数据库啦！功能虽实现了，不过朋友给我一建议“若无刷新就更好了”，呵呵......

下面是我的代码，还希望能帮到有需要的朋友。注意：我用到了文本框的TextChanged事件，需要将该文本框的AutoPostBack属性设置为true。

前台代码

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

后台代码

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();
        }
    }
}