实现输入框【输入填写+动态提示信息+下拉选择】

 

实现输入框能填写能下拉选择,填写时动态提示

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>

页面展示

更多精彩内容,加群434623999

转载于:https://my.oschina.net/u/3709170/blog/1576078

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值