Devexpress LookUpedit 开发

LookUpEdit 分别是 LookUpEdit、GridLookUpEdit、SearchLookUpEdit 和 TreeListLookUpEdit，之所以我用 1+3 种是因为个人觉得 LookUpEdit 是最简单的，也是最基础的一种，其它三个应该都是衍生的。

各自的特点：

1）LookUpEdit：我觉得最简单，就像普通的 ComboBox 一样使用即可，将 AutoComplete 设置为 true，配合 ImmediatePopup = true（用户输入字符立即弹出内容窗口）和 SearchMode，即可化身成为专业软件界面。个人感觉 SearchMode 设置为 AutoFilter 比较舒服，不但可以自动过滤不符合输入条件的项目，而且不会“阻塞”用户输入，比较自然符合习惯，不像 AutoComplete，是更智能但感觉很楞的就打断了用户的动作，用户不知道为什么就不能输入了，是坏了、错了还是死机了？
2）GridLookUpEdit：个人意见，如果没有什么额外查找要求，或是仅用来显示数据较少的二维表格，用它比较合适，因为看名字一目了然，就是个 Grid。

3）SearchLookUpEdit：个人比较推荐，既能显示数据，又自带查找，个人工具也能瞬间高大上，为何不用。

4）TreeListLookUpEdit：以 TreeList 的样式显示数据，看起来和 GridLookUpEdit几乎一模一样，因为我的演示数据是 DataTable，所以没有表现出其与 GridLookUpEdit 的区别，其实我想区别也不大，无外乎一个嵌套的是 Grid，一个嵌套的是 TreeList。

下面是一个实例：

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;


namespace WindowsFormsApplication1
{
    public partial class Form1 : Form
    {
        class Student
        {

            public string Name { get; set; }

            public int Age { get; set; }

        }


        public Form1()
        {
            InitializeComponent();
            
        }
        
        private void Form1_Load(object sender, EventArgs e)
        {
            List<Student> listStudent = new List<Student>();

            Student stu1 = new Student();

            stu1.Name = "高手";

            stu1.Age = 100;

            listStudent.Add(stu1);

            Student stu2 = new Student();

            stu2.Name = "大神";

            stu2.Age = 99;

            listStudent.Add(stu2);

            lookUpEdit1.Properties.DataSource = listStudent;//绑定数据源
            //lookUpEdit1.Properties.PopupWidth = lookUpEdit1.Width;
            lookUpEdit1.Properties.DropDownRows = listStudent.Count;
        }
    }
}

设计器代码：

 // lookUpEdit1
            // 
            this.lookUpEdit1.Location = new System.Drawing.Point(116, 62);
            this.lookUpEdit1.Name = "lookUpEdit1";
            this.lookUpEdit1.Properties.Buttons.AddRange(new DevExpress.XtraEditors.Controls.EditorButton[] {
            new DevExpress.XtraEditors.Controls.EditorButton(DevExpress.XtraEditors.Controls.ButtonPredefines.Combo)});
            this.lookUpEdit1.Properties.Columns.AddRange(new DevExpress.XtraEditors.Controls.LookUpColumnInfo[] {
            new DevExpress.XtraEditors.Controls.LookUpColumnInfo("Name", "Name3")});
            this.lookUpEdit1.Properties.DisplayMember = "Name";
            this.lookUpEdit1.Properties.NullText = "";
            this.lookUpEdit1.Properties.PopupFormMinSize = new System.Drawing.Size(166, 0);//比lookUpEdit1.Size少20即可 
            this.lookUpEdit1.Properties.ShowFooter = false;
            this.lookUpEdit1.Properties.ShowHeader = false;
            this.lookUpEdit1.Properties.TextEditStyle = DevExpress.XtraEditors.Controls.TextEditStyles.Standard;
            this.lookUpEdit1.Properties.ValueMember = "Age";
            this.lookUpEdit1.Size = new System.Drawing.Size(186, 20);
            this.lookUpEdit1.TabIndex = 0;
            // 比lookUpEdit1.Size少20即可 
            this.lookUpEdit1.Properties.ShowFooter = false;
            this.lookUpEdit1.Properties.ShowHeader = false;
            this.lookUpEdit1.Properties.TextEditStyle = DevExpress.XtraEditors.Controls.TextEditStyles.Standard;
            this.lookUpEdit1.Properties.ValueMember = "Age";
            this.lookUpEdit1.Size = new System.Drawing.Size(186, 20);
            this.lookUpEdit1.TabIndex = 0;
            //

要设置lookUpEdit1可编辑，在属性Properties下的TextEditStyle设置为Standard。

     lookupedit.Properties.ValueMember = 实际要用的字段;   //相当于editvalue
     lookupedit.Properties.DisplayMember =要显示的字段;    //相当于text
     lookupedit.Properties.DataSource = 数据源;

     lookUpEdit1.Properties.ShowDropDown = ShowDropDown.DoubleClick;
     lookUpEdit1.Properties.ImmediatePopup = true;//显示下拉列表
     lookUpEdit1.Properties.TextEditStyle = TextEditStyles.Standard;//允许输入
     lookUpEdit1.Properties.DropDownRows = 12;//默认显示的行
     lookUpEdit1.Properties.PopupWidth = 350;//设置宽带
     lookUpEdit1.Properties.NullText = "";//清空默认值

要设置下拉框长宽，需设置lookUpEdit1的Properties的PopupFormMinSize属性值。

获取选择值

string id = this.lookUpEdit1.EditValue.ToString(); //是lookUpEdit.Properties.ValueMember的值
string name = this.lookUpEdit1.Text.Trim(); //是lookUpEdit.Properties.DisplayMember的值

实现可输入的下拉框还可通过input和select来实现，实现思路：通过select与text文本框的结合，具体实现是通过将text文本框覆盖到select下拉框上，只露出三角形部分，再通过onchange()点击函数，给文本框赋值。即：

<div style="position:relative;">  
      <span style="margin-left:100px;width:18px;overflow:hidden;">  
       <select id="DanWei" style="width:235px;margin-left:-86px;height:31px;" onchange="danwei()">  
             <option value="m3/s" selected>m3/s</option>  
             <option value="mm">mm</option>  
             <option value="℃">℃</option>  
             <option value="KV">KV</option>  
        </select>  
        </span>    
        <input type="text" id="units" name="units" style="width: 215px;margin-left: -239px;height: 31px;color:#000;">  
  
</div>  
  
<script type="text/javascript">  
  
     //用于单位选择更换赋值给文本框  
     function danwei(){  
          var text=$("#DanWei").val();  
          $("#units").val(text);  
     }  
</script>

Devexpress LookUpedit 开发

猜你喜欢