SELECT2 4.0 with multi select in ASP.Net:如何获取和设置 selected 项?
SELEC2 4.0 with multi select in ASP.Net: How to get and set selected items?
我正在尝试将 ASP.Net 中的 SELECT2 与下拉列表结合使用。
这是我的 .aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="ASPNet_SELECT2_1._default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>a SELECT2 implementation in ASP.NET</title>
<script src="scripts/js/jquery-1.12.0.js"></script>
<script src="scripts/js/select2/select2.js"></script>
<link rel="stylesheet" href="css/select2.css" />
<script>
$(document).ready(function () {
$("#" + "<%=dd.ClientID%>").select2({
placeholder: "Select a Subject",
allowClear: true
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="dd" runat="server" ClientIDMode="Static" Width="300px" multiple="multiple"></asp:DropDownList>
</div>
<asp:Button ID="btnGetSelected" runat="server" Text="Get selected items" OnClick="btnGetSelected_Click" /> <asp:Button ID="btnSetSelected" runat="server" Text="Set selected items" OnClick="btnSetSelected_Click" />
<br />
<asp:Literal ID="lit" runat="server"></asp:Literal>
</form>
</body>
</html>
这是我背后的代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace ASPNet_SELECT2_1
{
public partial class _default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
for (int i = 0; i < 10; i++)
{
ListItem l = new ListItem("Item " + i.ToString());
dd.Items.Add(l);
}
}
}
protected void btnGetSelected_Click(object sender, EventArgs e)
{
lit.Text = dd.Text;
}
protected void btnSetSelected_Click(object sender, EventArgs e)
{
}
}
}
SELECT2 控件与我的下拉列表的绑定工作正常。我还为下拉列表设置了 "multiple" 属性以具有 multi select 功能。但是我无法获得 selected 项目。而且我也无法设置这些项目。
当我 select 多个元素并执行回发(例如单击按钮时),然后在回发后只有一个项目被 selected。我总是得到 selected 第一项。
如何获取所有 selected 项目并在回发时以及通过代码设置多个 selected 项目?
我已经通过使用带有 runat="server" 的 HTML Select 标签而不是使用 DropDownList 解决了这个问题,因为我认为回发功能等是在控件中实现的默认值,无法轻松更改。
这是我的 JS
$(document).ready(function () {
$("#select1").select2({
placeholder: "Select a Subject",
allowClear: true
});
});
这是我的 .aspx
<select id="select1" name="select1" runat="server" multiple="true" style="width:300px"></select>
这是我在 C# 中的代码隐藏,用于填充 select
中的项目
for (int i = 0; i < 10; i++)
{
ListItem l = new ListItem("Item " + i.ToString(), i.ToString());
select1.Items.Add(l);
}
这是获取和设置 selected 项目的方法
// GET SELECTED ITEMS
for (int i = 0; i <= select1.Items.Count - 1; i++)
{
if (select1.Items[i].Selected)
lit.Text += "<br /> - " + select1.Items[i].Text + " | " + select1.Items[i].Value;
}
// SET SELECTED ITEMS
select1.Items[2].Selected = true;
select1.Items[4].Selected = true;
我正在尝试将 ASP.Net 中的 SELECT2 与下拉列表结合使用。
这是我的 .aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="ASPNet_SELECT2_1._default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>a SELECT2 implementation in ASP.NET</title>
<script src="scripts/js/jquery-1.12.0.js"></script>
<script src="scripts/js/select2/select2.js"></script>
<link rel="stylesheet" href="css/select2.css" />
<script>
$(document).ready(function () {
$("#" + "<%=dd.ClientID%>").select2({
placeholder: "Select a Subject",
allowClear: true
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="dd" runat="server" ClientIDMode="Static" Width="300px" multiple="multiple"></asp:DropDownList>
</div>
<asp:Button ID="btnGetSelected" runat="server" Text="Get selected items" OnClick="btnGetSelected_Click" /> <asp:Button ID="btnSetSelected" runat="server" Text="Set selected items" OnClick="btnSetSelected_Click" />
<br />
<asp:Literal ID="lit" runat="server"></asp:Literal>
</form>
</body>
</html>
这是我背后的代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace ASPNet_SELECT2_1
{
public partial class _default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
for (int i = 0; i < 10; i++)
{
ListItem l = new ListItem("Item " + i.ToString());
dd.Items.Add(l);
}
}
}
protected void btnGetSelected_Click(object sender, EventArgs e)
{
lit.Text = dd.Text;
}
protected void btnSetSelected_Click(object sender, EventArgs e)
{
}
}
}
SELECT2 控件与我的下拉列表的绑定工作正常。我还为下拉列表设置了 "multiple" 属性以具有 multi select 功能。但是我无法获得 selected 项目。而且我也无法设置这些项目。
当我 select 多个元素并执行回发(例如单击按钮时),然后在回发后只有一个项目被 selected。我总是得到 selected 第一项。
如何获取所有 selected 项目并在回发时以及通过代码设置多个 selected 项目?
我已经通过使用带有 runat="server" 的 HTML Select 标签而不是使用 DropDownList 解决了这个问题,因为我认为回发功能等是在控件中实现的默认值,无法轻松更改。
这是我的 JS
$(document).ready(function () {
$("#select1").select2({
placeholder: "Select a Subject",
allowClear: true
});
});
这是我的 .aspx
<select id="select1" name="select1" runat="server" multiple="true" style="width:300px"></select>
这是我在 C# 中的代码隐藏,用于填充 select
中的项目for (int i = 0; i < 10; i++)
{
ListItem l = new ListItem("Item " + i.ToString(), i.ToString());
select1.Items.Add(l);
}
这是获取和设置 selected 项目的方法
// GET SELECTED ITEMS
for (int i = 0; i <= select1.Items.Count - 1; i++)
{
if (select1.Items[i].Selected)
lit.Text += "<br /> - " + select1.Items[i].Text + " | " + select1.Items[i].Value;
}
// SET SELECTED ITEMS
select1.Items[2].Selected = true;
select1.Items[4].Selected = true;