在 Javascript 中以自然方式添加后，我无法在 asp.net 中获取 Listbox 的值
Posted
技术标签:
【中文标题】在 Javascript 中以自然方式添加后，我无法在 asp.net 中获取 Listbox 的值【英文标题】：I can't get values of Listbox in asp.net after it was daynamically added in Javascript 【发布时间】：2021-05-05 16:01:48 【问题描述】：我每天在javascript中创建选择选项，然后单击一个asp：按钮以提交添加的选项。但我无法从 ListBox 中得到它。请帮帮我！！
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Hello.aspx.cs" Inherits="BeyondInfo.Hello" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Welcome to My First ASP.NET</title>
<script type="text/javascript">
function add()
var count = document.getElementById("count");
if (count.value == "")
count.value = 1;
count.value = parseInt(count.value) + 1;
var num = count.value;
var listBox2 = document.getElementById("ListBox2");
var optn = document.createElement("OPTION");
optn.value = num;
optn.text = num + "_add";
listBox2.options.add(optn);
</script>
</head>
<link href="Common.css" rel="stylesheet" />
<body>
<form id="form1" runat="server">
<div style="height: 277px">
<asp:ListBox ID="ListBox2" runat="server">
<asp:ListItem>b1222222222222222222222222222</asp:ListItem>
<asp:ListItem>b2</asp:ListItem>
<asp:ListItem>b3</asp:ListItem>
<asp:ListItem>b4</asp:ListItem>
</asp:ListBox>
<input id="count" type="hidden" />
<input id="btnAdd" type="button" value="ADD" onclick="add()"/>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
</form>
</body>
</html>
</p>
Hello.aspx.cs
public partial class Hello : System.Web.UI.Page
protected void Page_Load(object sender, EventArgs e)
protected void btnSubmit_Click(object sender, EventArgs e)
string sel = "";
foreach (ListItem item in ListBox2.Items)
sel +=item.Text + ",";
Label1.Text = sel;
【问题讨论】：
你不能使用 JS 和 webforms 来做到这一点，你必须使用 AJAX control toolkit 的 AJAX 控制面板 感谢您的回答，我会尝试使用您的方式，但首先，您能告诉我该代码有什么问题吗？ 那么 ListBox Id 不会是ListBox，它会是一些自动生成的值。 document.createElement("OPTION") 将不起作用，因为您还需要将选项添加到 ViewModel 并且您无法执行该客户端。这就是您需要使用 Ajax 控制工具包的原因。 TBH，你为什么要学习网络表单？如今，Webforms 几乎是不复存在的技术。 MVC 是较新的等价物。
这是similar question
感谢您的帮助，从您的回答中，我可能需要了解更多有关 Aps.net 的信息。
【参考方案1】：
尝试查看 NC01 的此帖子答案。你也许可以通过做类似的事情来实现你想要的。
基本上，它们将添加的字段存储在隐藏字段中，以便服务器端可以访问它们。
我相信您的问题是，当您将项目添加到 DropDownList 客户端（使用 JavaScript）时，当 PostBack 发生时，该项目将消失。解决这个问题的唯一方法是向页面添加一个隐藏的服务器控件，并在客户端添加项目时，也将其添加到隐藏的服务器控件，这样当 PostBack 发生时，您也可以将它添加到服务器端。
这是一个例子。
https://forums.asp.net/t/1287204.aspx?How+to+add+the+values+to+listbox+control+using+javascript
aspx file:
<form id="Form1" method="post" runat="server">
<asp:DropDownList id="DropDownList1" runat="server">
<asp:listitem value="1">Item 1</asp:listitem>
<asp:listitem value="2">Item 2</asp:listitem>
<asp:listitem value="3">Item 3</asp:listitem>
<asp:listitem value="4">Item 4</asp:listitem>
<asp:listitem value="5">Item 5</asp:listitem>
<asp:listitem value="6">Item 6</asp:listitem>
</asp:DropDownList>
<input id="DropDownList1NewItems" type="hidden" name="DropDownList1NewItems" runat="server">
<input type="button" onclick="addItem();" value="Add Item">
</form>
<script type="text/javascript">
<!--
function addItem()
// Add the item here...
var ddlRef = document.getElementById('<%= DropDownList1.ClientID %>');
var newOption = window.document.createElement('OPTION');
newOption.text = 'SomeNewItem';
newOption.value = 'SomeNewItem';
ddlRef.options.add(newOption);
var hiddenElementRef = document.getElementById('<%= DropDownList1NewItems.ClientID %>');
if ( hiddenElementRef.value.length > 0 )
hiddenElementRef.value += ';';
hiddenElementRef.value += 'SomeNewItem';
// -->
</script>
aspx.cs file:
private void Page_Load(object sender, System.EventArgs e)
if ( this.IsPostBack )
if ( DropDownList1NewItems.Value.Length > 0 )
string [] newItemsArray = DropDownList1NewItems.Value.Split(';');
for (int i=0; i<newItemsArray.Length; i++)
string newItem = newItemsArray[i];
DropDownList1.Items.Add(new ListItem(newItem, newItem));
DropDownList1NewItems.Value = string.Empty;
【讨论】：
以上是关于在 Javascript 中以自然方式添加后，我无法在 asp.net 中获取 Listbox 的值的主要内容，如果未能解决你的问题，请参考以下文章
如何在android中以编程方式将铃声添加到本机应用程序联系人