asp.net c# select 动态加载数据

1、说明通过 asp.net，利用jQuery ，c#语言给 select控件动态加载数据。前端页面使用的是.aspx类型的HTML页面，后台使用MVC上的controller控制器

2、webconfig 设置连接字符串

3、获取连接字符串

public class DBHelper
    {
        /// <summary>
        /// 获取数据库连接字符串
        /// </summary>
        /// <returns></returns>
        public static string getConnStr()
        {
            return WebConfigurationManager.ConnectionStrings["connStr"].ToString();
        }
    }

4、用到的数据表

我这里的数据表是Oracle中的，大家也可以用sql数据库

CREATE TABLE "DMKJ_SYSINFO_TS"."T_USER"
   (   "ID" NUMBER(10,0),
   "NAME" VARCHAR2(255 BYTE),
   "DESCRIBE" VARCHAR2(255 BYTE)
   }

5、前端页面代码

说明：需要自己引用jQuery的库文件

 1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="xx.aspx.cs" Inherits="xx.LoginPage" %>
 2 
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 4 <html xmlns="http://www.w3.org/1999/xhtml">
 5 <head>
 6     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 7     <title></title>
 8   //在这里引入jQuery的库文件
 9 
10 </head>
11 <body>
12  <div >                                                                
13                                 
14                                         
15 <select id="tt01"  style=" width: 150px; height: 40px;font-size:17px;line-height: 40px;padding-left: 60px;" >
16   </select>
17  </div>
18 <script type="text/javascript">
19         $(function () {
20 GetUserList();
21 
22 });
23  function GetUserList() {
24             $.post("Login/GetUser", function (data) {
25                 var table = data;           
26                 $("#tt01").empty(); //首先清空select现在有的内容
27                 $("#tt01").append("<option selected='selected'  value=0>请选择用户..</option>");
28                 for (var i = 0; i < table.length; i++) {
29                     var item = table[i];
30                     $("#tt01").append("<option  value=" + item.id + ">" + item.text + "</option>");
31                 }
32                 //返回的是json格式的数据
33             }, "json");
34         }
35 
36    </script>
37 </body>
38 </html>

View Code

6、后台代码

 1   public JsonResult GetUser()
 2         {
 3             string sqlStr = "select * from HYMGS_SYSINFO_FJ.t_office";
 4             OleDbDataReader dr =myExecuteReader(sqlStr);
 5             List<OfficeEntity> myList = new List<OfficeEntity>();
 6             while(dr.Read())
 7             {
 8                 OfficeEntity ob1 = new OfficeEntity() {
 9                     id = Convert.ToInt32(dr["PID"].ToString()),
10                     text = dr["NAME"].ToString()
11                 };
12                 myList.Add(ob1);
13             }
14             dr.Close();
15             return Json(myList, JsonRequestBehavior.DenyGet);
16         }
17 
18         public static OleDbDataReader myExecuteReader(string strSQL)
19         {    
20     
21                         //获取连接字符串
22 string strConn=DBHelper.getConnStr();
23             OleDbConnection oraCn=new OleDbConnection(strConn) ;
24             OleDbCommand OraCmd = new  OleDbCommand(strSQL,oraCn);
25             try
26             {
27                 oraCn.Open ();
28                 OleDbDataReader OraDr=OraCmd.ExecuteReader (CommandBehavior.CloseConnection);
29                 return OraDr;
30             }
31                 
32             catch(OleDbException e)
33             {        
34                 throw new Exception(e.Message);
35             }
36             finally
37             {
38                 //OraCmd.Dispose();
39                 //oraCn.Close ();
40             }
41         }

View Code

7、实体类

  public class UserEntity
    {
        public int id { get; set; }
        public string text { get; set; }
    }

asp.net c# select 动态加载数据

猜你喜欢