实现输入框【输入填写+动态提示信息+下拉选择】
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">
<optionvalue="123"></option>
<optionvalue="123"></option>
<optionvalue="123"></option>
<optionvalue="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>
页面展示
