實現輸入框能填寫能下拉選擇,填寫時動態提示 using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.We ...
實現輸入框能填寫能下拉選擇,填寫時動態提示
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class Default2 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (IsPostBack) { } using (UsersDataContext con = new UsersDataContext()) { string s = "" ; int count = 0; List<Users> ulist = con.Users.ToList(); for (int i = 0; i < ulist.Count; i++) { if (count > 0) s += ","; s += ulist[i].Nickname; count++; } HiddenField1.Value = s; //將需要的信息放到隱藏控制項中 } } }後臺數據
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!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></title> <script src="jquepy/jquery-1.7.1.min.js"></script> </head> <body> <form id="form1" runat="server"> <div> 用戶名: <asp:TextBox ID="TextBox1" runat="server" list="li" autocomplete="off"></asp:TextBox> <datalist id="li"> <option value="123"></option> <option value="123"></option> <option value="123"></option> <option value="123"></option> </datalist> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <asp:HiddenField ID="HiddenField1" runat="server" /> </div> </form> </body> </html> <script type ="text/javascript"> var b = $("#HiddenField1").val();//取隱藏的值 var strs = new Array();//定義數組 strs = b.split(","); //將字元分割 var v = ""; for (var i = 0; i < strs.length;i++) { v += "<option value=\"" + strs[i] + "\"> </option>"; } $("#li").html(v); //取值 從 TextBox 中取 $("#TextBox1").change(function () { var av = $("#TextBox1").val(); $("#Label1").html(av); }); </script>頁面展示