• Ext.net中ComboBox如何绑定数据库中的值


    本文分享自 然嗄 的博客,地址是:http://www.cnblogs.com/jianglan/archive/2012/03/29/2424177.html

     

    今天在项目中再次碰到了问题,就是Combobox中的值如果是直接绑定很简单。简单添加项就行了。代码如下:

    复制代码
    <ext:ComboBox ID="ComBox_SecretsLevel" runat="server" FieldLabel="密级" Width="250" EmptyText="请选择密级..." >                        
    <Items>
    <ext:ListItem Text="公开" Value="1"/>
    <ext:ListItem Text="保密" Value="2" />
    <ext:ListItem Text="绝密" Value="3" />
    </Items>
    </ext:ComboBox>
    复制代码

    但是要从数据库中获取绑定该如何操作呢?
    找了下网上的质量好像挺少的,去官网找了些Combobox的例子。虽然不是写死在控件上,但是发现他也只不过是通过获取后台的数组,然后绑定数据来操作的,也没有真正的操作数据库。于是我通过尝试,结合了例子和实际,实现了绑定后台数据库的要求,这边与大家分享下。
    这边数据库中的参数及值如图:

    获取表中数据只要简单的sql查询语句,这边就不详细讲解了。
    在页面中,首先是aspx页面的代码:

    复制代码
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LR_FileReg.aspx.cs" Inherits="EasyCreate.DFMS.WebUI.LR_FileReg" %>

    <%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
    <title>绑定Combobox后台数据</title>
    </head>
    <body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server"/>
    <ext:Store ID="Store_SecretsCom" runat="server">
    <Reader>
    <ext:JsonReader>
    <Fields>
    <ext:RecordField Name="SecretsLevelID" Type="Int"/>
    <ext:RecordField Name="SecretsLevelName" Type="String" />
    </Fields>
    </ext:JsonReader>
    </Reader>
    </ext:Store>
    <ext:ComboBox ID="ComBox_SecretsLevel" runat="server" FieldLabel="密级" Width="250" EmptyText="请选择密级..."
    StoreID="Store_SecretsCom" ValueField="SecretsLevelID" DisplayField="SecretsLevelName">
    </ext:ComboBox>
    </form>
    </body>
    </html>
    复制代码

    后台.cs文件代码:

    复制代码
    H_FileLR h_file = new H_FileLR();//调用远程服务及方法,进行基本的数据库操作

    protected void Page_Load(object sender, EventArgs e)
    {
    if (!X.IsAjaxRequest)
    {
    //首次加载时执行
    DataSet ds_Com= h_file.SecretCom(); //返回的值是DataSet类型的数据
    DataTable dt_Com = ds_Com.Tables[0]; //获取表中数据,Combobox一般的参数都是两个:Value传递的参数和Test显示的值
    List<object> list = new List<object>(dt_Com.Rows.Count);
    foreach (DataRow dr_Com in dt_Com.Rows) //遍历获取两个值
    {
    list.Add(new
    {
    SecretsLevelID =Int32.Parse( dr_Com["SecretsLevelID"].ToString()),
    SecretsLevelName = dr_Com["SecretsLevelName"].ToString()
    });
    }
    Store_SecretsCom.DataSource = list; //绑定数据
    Store_SecretsCom.DataBind();
    }
    }
    复制代码

    下面的截图是项目中的效果图,不是很好,请见谅:

    这样,简单的数据绑定就实现了,其实还是挺简单的吧。大家有什么好的方法和建议都记得给我留言哈。该博文为本人原创,转帖请注明出处,尊重著作权哈。

    续文:
    今天再次使用Comobox控件绑定数据库中值的时候,试着尝试了下新的方法,效果很好,与之前的方法简单了好多。下面就和大家介绍下,而且能举一反三。

    复制代码
     if(!IsPostBack)
    {
    DataSet ds_Com = h_file.ComoboxBind();
    DataTable dt_Secret = ds_Com.Tables[0]; //获取表中密级表中数据,Combobox一般的参数都是两个:Value传递的参数和Test显示的值
    foreach (DataRow dr_Secret in dt_Secret.Rows) //遍历获取两个值
    {
    Ext.Net.ListItem Secretslist = new Ext.Net.ListItem(); //每次创建一个Ext.Net.ListItem的对象
    Secretslist.Value = dr_Secret["SecretsLevelID"].ToString();
    Secretslist.Text = dr_Secret["SecretsLevelName"].ToString();
    ComBox_SecretsLevel.Items.Add(Secretslist);
    }
    }
    复制代码

    分别遍历的把每行的值赋值给该对象的Text和Value属性。然后用Items.Add(Secretslist)的方法添加到List中即可。
    用这种方法的好处太明显了,没有了上次说的Store的创建,也不用绑定ValueField和 DisplayField,简直一举多得啊!

    其实,我们在写前台的值的时候,忽略了他的实质,细心的朋友可能会巧妙的发现。其实前台的每个控件在后台都能创建出来,属性也是能在后台重新赋值改变的。

    复制代码
    <ext:ComboBox ID="ComBox_SecretsLevel" runat="server" FieldLabel="密级" Width="250" EmptyText="请选择密级..." >                        
    <Items>
    <ext:ListItem Text="公开" Value="1"/>
    <ext:ListItem Text="保密" Value="2" />
    <ext:ListItem Text="绝密" Value="3" />
    </Items>
    </ext:ComboBox>
    复制代码

    我们可以巧妙的发现:ComBox_SecretsLevel.Items.Add(Secretslist);就是相当于给ListItem中添加每项。

    这次使我更加坚定了信念,只要坚持,就一定会有收获。每天哪怕进步一点点也是新的提高。

  • 相关阅读:
    input只允许输入正整数
    CSS如何作小于1PX的边
    时间戳的处理
    图片转base64上传,视频同理。
    APIcloud微信支付和支付宝支付(方案2,主要在后台进行)
    H5滑条(input type=range)
    checkbox/radio 样式修改
    APIcloud制作APP 微信支付与支付宝支付
    JS获取鼠标左(右)滑事件
    DOM(Document object madle) 文档对象模型: 元素节点 文本节点 属性节点
  • 原文地址:https://www.cnblogs.com/ElvisZhongShao/p/4091295.html
Copyright © 2020-2023  润新知