aspx页面 ASP.NET Web Forms中的DropDownList添加搜索功能使用select2

.NET兼职社区

select2依赖jquery

JS直接去官网下载:https://select2.org/getting-started/basic-usage或者https://www.bootcdn.cn/

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
    <script src="Scripts/jquery-3.4.1.min.js"></script>
    <link href="Scripts/select2.min.css" rel="stylesheet" />
    <script src="Scripts/select2.min.js"></script>



      水果:  <asp:DropDownList ID="SelectSecondParty" runat="server" Width="300px"></asp:DropDownList>

    <script>
        $(document).ready(function () {
            $('#MainContent_SelectSecondParty').select2();
        });
    </script>

</asp:Content>

后台代码 初始化点数据:

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

namespace WebApplication1
{
    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            // 添加水果到DropDownList
            SelectSecondParty.Items.Add(new ListItem("苹果", "Apple"));
            SelectSecondParty.Items.Add(new ListItem("香蕉", "Banana"));
            SelectSecondParty.Items.Add(new ListItem("樱桃", "Cherry"));
            SelectSecondParty.Items.Add(new ListItem("葡萄", "Grape"));
            SelectSecondParty.Items.Add(new ListItem("柠檬", "Lemon"));
            SelectSecondParty.Items.Add(new ListItem("芒果", "Mango"));
            SelectSecondParty.Items.Add(new ListItem("橙子", "Orange"));
            SelectSecondParty.Items.Add(new ListItem("桃子", "Peach"));
            SelectSecondParty.Items.Add(new ListItem("梨", "Pear"));
            SelectSecondParty.Items.Add(new ListItem("菠萝", "Pineapple"));
            SelectSecondParty.Items.Add(new ListItem("草莓", "Strawberry"));
            SelectSecondParty.Items.Add(new ListItem("西瓜", "Watermelon"));
        }
    }
}

效果截图:
在这里插入图片描述

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ASP.NET ,可以使用 TextBox、DropDownList 等普通控件来实现登录和注册功能。以下是一个简单的示例: 首先,创建一个登录页面,包括用户名和密码的输入框以及一个“登录”按钮。可以使用如下代码: ``` <%@ Page Language="C#" %> <!DOCTYPE html> <html> <head runat="server"> <title>Login Page</title> </head> <body> <form id="form1" runat="server"> <div> <label>Username:</label> <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox> </div> <div> <label>Password:</label> <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox> </div> <div> <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click" /> </div> </form> </body> </html> ``` 然后,在后台代码实现登录功能。可以在按钮的 OnClick 事件编写代码来验证用户名和密码。以下是一个简单的示例: ``` protected void btnLogin_Click(object sender, EventArgs e) { string username = txtUsername.Text; string password = txtPassword.Text; // 在这里编写验证用户名和密码的代码 // 如果验证通过,可以跳转到另一个页面 // 如果验证失败,可以显示错误消息 } ``` 接下来,创建一个注册页面,包括用户名、密码、确认密码和邮箱等输入框以及一个“注册”按钮。可以使用如下代码: ``` <%@ Page Language="C#" %> <!DOCTYPE html> <html> <head runat="server"> <title>Registration Page</title> </head> <body> <form id="form1" runat="server"> <div> <label>Username:</label> <asp:TextBox ID="txtUsername" runat="server"></asp:TextBox> </div> <div> <label>Password:</label> <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox> </div> <div> <label>Confirm Password:</label> <asp:TextBox ID="txtConfirmPassword" runat="server" TextMode="Password"></asp:TextBox> </div> <div> <label>Email:</label> <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox> </div> <div> <asp:Button ID="btnRegister" runat="server" Text="Register" OnClick="btnRegister_Click" /> </div> </form> </body> </html> ``` 然后,在后台代码实现注册功能。可以在按钮的 OnClick 事件编写代码来将用户信息保存到数据库。以下是一个简单的示例: ``` protected void btnRegister_Click(object sender, EventArgs e) { string username = txtUsername.Text; string password = txtPassword.Text; string confirmPassword = txtConfirmPassword.Text; string email = txtEmail.Text; if (password != confirmPassword) { // 如果两次输入的密码不一致,可以显示错误消息 return; } // 在这里编写将用户信息保存到数据库的代码 // 如果保存成功,可以跳转到另一个页面 // 如果保存失败,可以显示错误消息 } ``` 当然,这只是一个简单的示例,实际的登录和注册功能可能需要更复杂的验证和处理逻辑。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值