Remove From My Forums

How can I convert my asp listview to being editable?

Question

User1857760563 posted

Through searching, I've seen posts that indicate you can convert the listview element in ASP to something that can be edited, but I can't seem to get anything to work, so I must be overlooking something obvious and it's time to request help. I have a working listview element but now would like to make some of the fields of a selected row editable.

Thanks

HTML:

<asp:ListView ID="lvwOutput" runat="server" DefaultMode="Edit" CurrentMode="Edit" onitemdatabound="lvwOutput_ItemDataBoundToList" style="height:800px; overflow: scroll" OnItemEditing="lvwOutput_ItemEditing" EditIndex="-1">

<LayoutTemplate>

<table id="lvwOutputTable" border="2" cellpadding="1" style="width=100%; font-family: Calibri; font-size: 12px">

<tr style="background-color:#E5E5FE">

<th align="left"><asp:LinkButton ID="lnkId" runat="server" CommandName="Sort" CommandArgument="dateTime">Date Time</asp:LinkButton></th>

<th align="left"><asp:LinkButton ID="LinkButton13" runat="server" CommandName="Sort" CommandArgument="additionalNotes"></asp:LinkButton>Additional Notes</th>

<th></th>

</tr>

<tr id="itemPlaceholder" runat="server"></tr>

</table>

</LayoutTemplate>

<ItemTemplate>

<tr style="width=100%;">

<td><asp:Label runat="server" ID="lblId"><%#Eval("dateTime") %></asp:Label></td>

<td><asp:Label runat="server" ID="Label13"><%#Eval("additionalNotes") %></asp:Label></td> 

</tr>

</ItemTemplate> 

</asp:ListView>

Thursday, June 7, 2018 6:33 PM

Answers

User-330142929 posted

Hi Oerten,

According to your description. I test your codes and make a demo below:

You should add EditItemTemplate to ListView and process itemediting and ItemUpdating event handler.

Aspx.

<asp:ListView ID="ListView1" runat="server" DefaultMode="Edit" CurrentMode="Edit" OnItemDataBound="ListView1_ItemDataBound" OnItemEditing="ListView1_ItemEditing"  OnItemUpdating="ListView1_ItemUpdating" EditIndex="-1">
                <EditItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
                            <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
                        </td>
                        <td>
                            <asp:Label ID="IDLabel1" runat="server" Text='<%# Eval("ID") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="NameTextBox" runat="server" Text='<%# Bind("Name") %>' />
                        </td>
                        <td>
                            <asp:TextBox ID="PriceTextBox" runat="server" Text='<%# Bind("Price") %>' />
                        </td>
                    </tr>
                </EditItemTemplate>
                <ItemTemplate>
                    <tr style="">
                        <td>
                            <asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="Edit" />
                        </td>
                        <td>
                            <asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' />
                        </td>
                        <td>
                            <asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Name") %>' />
                        </td>
                        <td>
                            <asp:Label ID="PriceLabel" runat="server" Text='<%# Eval("Price") %>' />
                        </td>
                    </tr>
                </ItemTemplate>
                <LayoutTemplate>
                    <table runat="server">
                        <tr runat="server">
                            <td runat="server">
                                <table id="itemPlaceholderContainer" runat="server" border="0" style="">
                                    <tr runat="server" style="">
                                        <th runat="server"></th>
                                        <th runat="server">ID</th>
                                        <th runat="server">Name</th>
                                        <th runat="server">Price</th>
                                    </tr>
                                    <tr id="itemPlaceholder" runat="server">
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr runat="server">
                            <td runat="server" style=""></td>
                        </tr>
                    </table>
                </LayoutTemplate>
            </asp:ListView>

Code behind.

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                this.ListView1.DataSource = GetDataTable();
                this.ListView1.DataBind(); 
            }
 
        }
        public DataTable GetDataTable()
        {
            SqlConnection connection = new SqlConnection(@"Data Source=(localdb)\MSSQLLocalDB;Initial Catalog=DataStore;Integrated Security=True;Connect Timeout=30;Encrypt=False;TrustServerCertificate=False;ApplicationIntent=ReadWrite;MultiSubnetFailover=False");
            SqlCommand command = new SqlCommand();
            command.CommandText = "select * from products";
            command.CommandType = CommandType.Text;
            command.Connection = connection;
            SqlDataAdapter sda = new SqlDataAdapter(command);
            DataTable dt = new DataTable();
            sda.Fill(dt);
            return dt;
        }
        protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e)
        {
            
        }
        protected void ListView1_ItemEditing(object sender, ListViewEditEventArgs e)
        {
            this.ListView1.EditIndex = e.NewEditIndex;
            this.ListView1.DataSource = GetDataTable();
            this.ListView1.DataBind();
        }
        protected void ListView1_ItemUpdating(object sender, ListViewUpdateEventArgs e)
        {
            int id = Convert.ToInt32(((Label)ListView1.Items[e.ItemIndex].FindControl("IDLabel1")).Text);
            TextBox name = (TextBox)ListView1.Items[e.ItemIndex].FindControl("NameTextBox");
            TextBox price = (TextBox)ListView1.Items[e.ItemIndex].FindControl("PriceTextBox");
            if (name.Text != string.Empty || price.Text != string.Empty)
            {
                string Name = name.Text;
                string Price = price.Text;
                SqlConnection connection = new SqlConnection(@"Data Source=(localdb)\MSSQLLocalDB;Initial Catalog=DataStore;Integrated Security=True;Connect Timeout=30;Encrypt=False;TrustServerCertificate=False;ApplicationIntent=ReadWrite;MultiSubnetFailover=False");
                SqlCommand command = new SqlCommand();
                command.CommandText = "update Products Set Name='"+Name+"',Price="+Price+" where Id="+id;
                
                command.CommandType = CommandType.Text;
                command.Connection = connection;
                connection.Open();
                command.ExecuteNonQuery();
                connection.Close();
            }
            this.ListView1.EditIndex = -1;
            this.ListView1.DataSource = this.GetDataTable();
            this.ListView1.DataBind();
        }
    }

Table design.

How it works.

Please feel free to let me know if you have any question.

Best Regards,

Abraham

Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM

Friday, June 8, 2018 9:26 AM

All replies

0

Sign in to vote
User632428103 posted

Hello turbo

you can do that with the

<EditItemTemplate>

in design view looks at this sample

https://www.aspsnippets.com/Articles/ASPNet-ListView-EditItemTemplate-example-in-C-and-VBNet.aspx
Friday, June 8, 2018 7:40 AM