Как удалить или добавить элемент динамически через пользовательский идентификатор HTML?

Question

Мне удалось разместить div с пользовательским идентификатором с указанным кодом, и мне нужно знать, как я могу удалить или добавить больше материала в пользовательский div ...

IЯ пробовал locate.InnerHTML, но, конечно, не сработало.

И ClientScript.RegisterStartupScript(this.GetType(), "remove", "<script>$('" + locate + "').remove();</script>");, и ничего не произошло.

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Test2.aspx.cs" Inherits="StepFollowingDemo.WebForm1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

    <br />
    <asp:button runat="server" type="button" ID="BtnAdd" Text="Add more" class="btn btn-basic"/>
    <asp:button runat="server" type="button" ID="BtnAdd2" Text="Add Dual" class="btn btn-warning"/> <!--This button is meant to delete the last <div> placed by the id ignore the name for now-->
    <hr />
    <div runat="server" class="well container">
        <div id="TestDiv" runat="server" class="row">

        </div>
    </div>

    <br />
    <div class="well">
        <div class="row">
            <div class="well col-sm-1">1.</div>
        </div>
        <div class="row">
            <div class="well col-sm-1">a1.</div>
            <div class="well col-sm-1">b1.</div>
        </div>
    </div>

</asp:Content>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace StepFollowingDemo
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        static int counter = 1;
        string count = counter.ToString(); //Step count
        string locate = "add"+(counter - 1).ToString(); //Locate last step by id
        public void Page_Load(object sender, EventArgs e)
        {
            BtnAdd.Click += BtnAdd_Click; //Add singular step
            BtnAdd2.Click += BtnAdd2_Click; //Add a two way step
        }

        private void BtnAdd2_Click(object sender, EventArgs e)
        {
            //Response.Write("<script>alert('"+locate+"')</script>"); //Alert to know wich one is the latest step
            //ClientScript.RegisterStartupScript(this.GetType(), "remove", "<script>$('" + locate + "').remove();</script>");
        }

        private void BtnAdd_Click(object sender, EventArgs e)
        {
            counter++;
            TestDiv.InnerHtml += "<div id='add"+ count +"'runat='server' class='col-sm-4'>";
            TestDiv.InnerHtml += "<h3>"+count+". </h3>";
            TestDiv.InnerHtml += "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>";
            TestDiv.InnerHtml += "</div>";
        }

    }
}

Эта кнопка должна удалить объект, помещенный при захвате. Пользовательский идентификатор, который был сгенерирован с ним, если у вас, ребята, есть что-то еще, что я мог бы сделать, будет высоко ценится!

Answer 1

Предполагается, что эта строка является jquery:

ClientScript.RegisterStartupScript (this.GetType (), "remove", "$ ('" + locate + "') .remove ();");

Вы не нацеливаетесь на идентификатор элемента, который пытаетесь удалить, потому что вы не можете просто вставить идентификатор, вы должны сообщить jquery, что это идентификатор. Чтобы назначить элемент div по идентификатору для удаления, вам нужно что-то вроде этого:

ClientScript.RegisterStartupScript (this.GetType (), "remove", "$ ('div #" + locate + "') .remove (); ");

Документация Jquery: https://api.jquery.com/remove/, https://api.jquery.com/id-selector/

Answer 2

Я бы использовал панель asp: вместо div.

Затем вы могли бы использовать защищенную строку, чтобы записать вывод html (включая ваш div) и изменить его в событии нажатия кнопки. StringBuilder поможет создать этот вывод в коде файла.

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