Как удалить динамически созданные текстовые поля в asp.net? - PullRequest
2 голосов
/ 28 апреля 2011

Следующий блок кода позволяет пользователю динамически создавать элементы управления текстовым полем.Однако при каждом создании я хотел бы добавить кнопку удаления, чтобы удалить указанное текстовое поле.Я знаю, что могу сделать это, добавив элемент управления кнопки при создании текстового поля и назначив событие соответствующей кнопке.Однако такое действие приведет к возникновению неудобных ситуаций, например, когда вы удаляете текстовое поле, иногда оно удаляет последнее текстовое поле, а иногда оно будет работать успешно.У меня вопрос: как добавить кнопку рядом с каждым созданным текстовым полем, чтобы пользователь мог удалить созданный элемент управления, сохранив при этом все остальные динамические элементы управления?

Первая страница:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DynamicControls.aspx.cs" Inherits="MyAspnetApp.DynamicControls" EnableViewState="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server"></head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Button ID="btnAddTextBox" runat="server" Text="Add" OnClick="btnAddTextBox_Click" />
        <asp:Button ID="btnWriteValues" runat="server" Text="Write" OnClick="btnWriteValues_Click" />
        <asp:PlaceHolder ID="phControls" runat="server" />
    </div>
    </form>
</body>
</html>

Код позади

using System;
using System.Web.UI.WebControls;

namespace MyAspnetApp
{
    public partial class DynamicControls : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //Recreate textbox controls
            if(Page.IsPostBack)
            {
                for (var i = 0; i < TextBoxCount; i++)
                    AddTextBox(i);
            }
        }

        private int TextBoxCount
        {
            get 
            {
                var count = ViewState["txtBoxCount"];
                return (count == null) ? 0 : (int) count;
            }
            set { ViewState["txtBoxCount"] = value; }
        }

        private void AddTextBox(int index)
        {
            var txt = new TextBox {ID = string.Concat("txtDynamic", index)};
            txt.Style.Add("display", "block");
            phControls.Controls.Add(txt);
        }

        protected void btnAddTextBox_Click(object sender, EventArgs e)
        {
            AddTextBox(TextBoxCount);
            TextBoxCount++;
        }

        protected void btnWriteValues_Click(object sender, EventArgs e)
        {
            foreach(var control in phControls.Controls)
            {
                var textBox = control as TextBox;
                if (textBox == null) continue;
                Response.Write(string.Concat(textBox.Text, "<br />"));
            }
        }
    }
}

Ответы [ 4 ]

1 голос
/ 05 мая 2011

Я решил проблему. Хитрость заключалась в том, чтобы сделать его невидимым, а не удалять элемент управления, когда пользователь нажимает кнопку удаления.

1 голос
/ 28 апреля 2011

Если вы хотите поиграть с динамическим добавлением и удалением элементов управления в ASP.NET, вы должны прочитать превосходную и исчерпывающую статью Дэйва Рида: « Истинное пониманиеДинамическое управление".

Если вы не понимаете связанных с этим проблем - таких как мандат, что элементы управления деревом должны быть полностью реконструированы при каждом запросе к странице - тогда вы подписываетесь на мирболи.Как только вы поймете эти проблемы, вы станете намного лучшим разработчиком ASP.NET в целом (по крайней мере, я так считал).Удачи!Keith

0 голосов
/ 28 апреля 2011

<asp:repeater> может быть тем, что вы ищете.Тогда обработчик щелчка кнопки удаления будет состоять в том, чтобы просто удалить родительский элемент (что приведет к удалению всего повторяющегося элемента), а обработчик добавления будет добавить еще один элемент.

0 голосов
/ 28 апреля 2011

Я бы порекомендовал вам НЕ делать это через Full PostBack. Вам лучше просто скрыть это на стороне клиента с помощью Javascript.

Если вам нужно сохранить часть состояния сервера, используйте AJAX Postbacks AKA XHR для связи с сервером. (Я просто ненавижу перелистывать страницы, LOL)

Кстати, это идеальный вариант для такого рода вещей: http://examples.ext.net/#/Events/DirectMethods/Overview/

...