aspx Web 用户控件 多选下拉框
HTML 部分<%@ Control Language="C#" AutoEventWireup="true" CodeFile="MultiSelectDropDown.ascx.cs" Inherits="UserControl_MultiSelectDropDown" %><asp:TextBox ID="txtSelection" runat="server" placeholder="请选择"></asp:TextBox>
<asp:Panel ID="Panel1" runat="server">
<asp:Panel ID="Panel2" runat="server">
<asp:CheckBoxList ID="cbSelections" runat="server">
</asp:CheckBoxList>
</asp:Panel>
<div style="display: flex; padding: 2px;">
<div>清空</div>
<div>确定</div>
</div>
</asp:Panel>
<script type="text/javascript">
function showSelectionBox() {
var panel = document.getElementById('<%= Panel1.ClientID %>');
panel.style.display = 'block';
panel.style.position = 'absolute';
panel.style.backgroundColor = '#fff';
panel.style.padding = "10px";
panel.style.textAlign = "left";
var panel2 = document.getElementById('<%= Panel2.ClientID %>');
panel2.style.height = "200px";
panel2.style.overflowY = "scroll";
var txtSelection = document.getElementById('<%= txtSelection.ClientID %>');
//panel.style.top = txtSelection.getBoundingClientRect().top + txtSelection.style.offsetHeight + 'px';
panel.style.marginTop = txtSelection.getBoundingClientRect().height + 'px';
panel.style.left = txtSelection.getBoundingClientRect().left + 'px';
}
function selectItem() {
var varray = GetCheckBoxListValue('<%= cbSelections.ClientID %>');
if (varray.length > 0) {
var txtSelection = document.getElementById('<%= txtSelection.ClientID %>');
txtSelection.value = varray.join(',');
}
initCbSelections();
}
function reset() {
ResetCheckBoxListValue('<%= cbSelections.ClientID %>');
var txtSelection = document.getElementById('<%= txtSelection.ClientID %>');
txtSelection.value = '';
initCbSelections();
}
function initCbSelections() {
var panel = document.getElementById('<%= Panel1.ClientID %>');
panel.style.display = 'none';
}
function ResetCheckBoxListValue(objID) {
var CheckBoxList = document.getElementById(objID);
if (CheckBoxList == null) return;
if (CheckBoxList.tagName == "TABLE") {
for (i = 0; i < CheckBoxList.rows.length; i++)
for (j = 0; j < CheckBoxList.rows.cells.length; j++)
if (CheckBoxList.rows.cells.childNodes)
if (CheckBoxList.rows.cells.childNodes.checked == true)
CheckBoxList.rows.cells.childNodes.checked = false;
}
if (CheckBoxList.tagName == "SPAN") {
for (i = 0; i < CheckBoxList.childNodes.length; i++)
if (CheckBoxList.childNodes.tagName == "INPUT")
if (CheckBoxList.childNodes.checked == true) {
CheckBoxList.childNodes.checked = false;
}
}
}
function GetCheckBoxListValue(objID) {
var v = new Array();
var CheckBoxList = document.getElementById(objID);
if (CheckBoxList == null) return v;
if (CheckBoxList.tagName == "TABLE") {
for (i = 0; i < CheckBoxList.rows.length; i++)
for (j = 0; j < CheckBoxList.rows.cells.length; j++)
if (CheckBoxList.rows.cells.childNodes)
if (CheckBoxList.rows.cells.childNodes.checked == true)
v.push(CheckBoxList.rows.cells.childNodes.innerText);
}
if (CheckBoxList.tagName == "SPAN") {
for (i = 0; i < CheckBoxList.childNodes.length; i++)
if (CheckBoxList.childNodes.tagName == "INPUT")
if (CheckBoxList.childNodes.checked == true) {
i++;
v.push(CheckBoxList.childNodes.innerText);
}
}
return v;
}
initCbSelections();
</script>
C# 部分
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class UserControl_MultiSelectDropDown : System.Web.UI.UserControl
{
public string CssClass
{
get { return txtSelection.CssClass; }
set { txtSelection.CssClass = value; }
}
public ListItemCollection Items
{
get
{
return cbSelections.Items;
}
set
{
var data = value as ListItemCollection;
cbSelections.DataSource = data;
cbSelections.DataBind();
}
}
public List<string> SelectedTexts
{
get { return txtSelection.Text.Split(',').ToList(); }
}
protected void Page_Load(object sender, EventArgs e)
{
}
}
使用方法
<%@ Register TagPrefix="uc" TagName="MultiSelectDropDown" Src="~/UserControl/MultiSelectDropDown.ascx" %>
<uc:MultiSelectDropDown ID="multiSelectDropDown" runat="server" CssClass="Public_Input IE_textcentered"></uc:MultiSelectDropDown>
this.multiSelectDropDown.Items.Add(new ListItem(item.Value, item.Key));
multiSelectDropDown.SelectedTexts web form早就到了不维护了，过时技术，现在是mvc再或是前段框架vue angularjs，wen form必须配置ajax体验才好一点，回发导致的页面刷新太严重，viewstate也是 没看懂。。。 - -！ 过时了，前端框架顶上 cn005897 发表于 2023-8-1 08:29
过时了，前端框架顶上
内部用的，开发怎么快怎么来 EnterpriseSolu 发表于 2023-8-1 04:08
web form早就到了不维护了，过时技术，现在是mvc再或是前段框架vue angularjs，wen form必须配置ajax体验才 ...
有没有可能是不对外的？想用啥就用啥，怎么简单怎么来
页:
[1]