时间戳

首页 > 解决方案 > 如何选择动态创建的输入的 ID？

javascript - 如何选择动态创建的输入的 ID？

问题描述

我正在尝试做的事情：

JS 中的工作理念：

在基本形式中，我试图在 C# 应用程序中重现它

为了澄清，用户必须能够选择有多少部分（并命名每个部分）。

=>示例：我的项目有两个部分，part_1 = "morning" 和 part_2 = "afternoon"。

为了重现这一点，我做了以下事情：

表单.aspx：

<myform>
    <asp:TextBox CssClass="form-control" runat="server" type="number" ID="parts_counter" />
    <div id="content" runat="server"></div>
</myform>

=> 为什么：parts_counter的值意味着读取并使用 javascript 块（我知道...）我动态创建输入

javascript_form.js：

let counter = document.getElementById('parts_counter');
let content = document.getElementById('content');
counter.addEventListener('change', function (e) {
  if (counter.value == 0) {
    content.innerHTML = "";
  } else {
    content.innerHTML = "";
    for (let i = 0; i < counter.value; i++) {
      content.innerHTML += 
        "<input type='text' id='part_" + i + "' placeholder='Ex : Part name'/><br>";
        // ---------------------^^^^^^^^^^^^
        // THIS IS THE PART I WANT TO BE ABLE TO READ IN C # Codebehind
    }
  }
})

form.aspx.designer.cs ：

protected global::System.Web.UI.WebControls.TextBox part_0;
protected global::System.Web.UI.WebControls.TextBox part_1;
protected global::System.Web.UI.WebControls.TextBox part_2;
protected global::System.Web.UI.WebControls.TextBox part_3;
protected global::System.Web.UI.WebControls.TextBox part_4;

=> 为什么：我尝试预先注册生成的 ID，因为在用户场景中没有理由拥有超过 5 个部分。

form.aspx.cs ：

for (var i = 0; i < Convert.ToInt32(parts_counter.Text); i++)
{
    var nomPartie = "partie_" + i;
    var textBoxPartie = new TextBox();
    textBoxPartie.ID = nomPartie;
    // Do something for each
    i++;
}

=> 为什么：

  1. 我读了计数器的值，
  2. 我循环每个值以执行服务器端操作

我（结束）查看了 CodeProject、SO、ASPSnippets 上的一些解决方案，我确定我想错了，你能否告诉我是否有特定的方法来生成输入并在之后获取他们的 ID代码隐藏？

欢迎每一分钱

标签： javascriptc#asp.net

解决方案

推荐阅读