webform简单控件与复合控件

Posted 2020-08-14

表单元素：

文本类：  --简单控件
文本框：<input type="text" /> 
密码框：<input type="password" />
文本域：<textarea></textarea> 
隐藏域：<input type="hidden" /> 

按钮类：  --简单控件
普通按钮：<input type="button" value="按钮1" />
提交按钮：<input type="submit" value="提交" />
重置按钮：<input type="reset" value="重置" />
图片按钮：<input type="image" src="" />

选择类：  --复合控件
单选框：<input type="radio" />
复选框：<input type="checkbox" />

下拉列表：<select>
　　　　　<option></option>
　　　　　</select>

文件选择：<input type="file" />

二、复合控件
1、RadioButton 和 CkeckBox不建议使用
（1）在html中的Radio在单击单选按钮后面的文字时不选中
解决方法：<Label far="nan">男</label>
（2）RadioButton分组的属性GroupName

2、RadioButtonList和DropDownList
这两个控件都是单选，DropDownList没有布局
（1）绑定上数据
1）编辑列
2）查数据库，写在Page_Load中
方法一：遍历集合

          List<Nation> list = new NationData().Select();

           foreach (Nation n in list)
            {
                ListItem li = new ListItem(n.NationName, n.NationCode);
                RadioButtonList1.Items.Add(li);
            }

方法二：数据源

          List<Nation> list = new NationData().Select();
           RadioButtonList1.DataSource = list;//数据源指向
            RadioButtonList1.DataTextField = "NationName";//显示值
            RadioButtonList1.DataValueField = "NationCode";//实际值
            RadioButtonList1.DataBind();//绑定

（2）选中数据
默认数据必须if(IsPostBack){}

RadioButtonList1.SelectedIndex = 0;//索引
  RadioButtonList1.SelectedValue = "N001";//实际值

（3）取值

        Label1.Text = "";
        ListItem li = RadioButtonList1.SelectedItem;
        Label1.Text += li.Value + "," + li.Text;

（4）布局
RepeatDirection 布局方向 
Vertical垂直 Horizontal水平
RepeatColumms 布局项的列数

3、CkeckBoxList 和ListBox
这两个数据都是多选，ListBox没有布局。
ListBox修改属性SelectionMode可选多条。

（1）绑定上数据

建议使用遍历集合

（2）选中数据
默认数据必须if(IsPostBack){}

可选多个遍历集合

         foreach (Nation n in list)
            {
                ListItem li = new ListItem(n.NationName, n.NationCode);
                if (li.Value == "N001" || li.Value == "N003")
                    li.Selected = true;
                CheckBoxList1.Items.Add(li);
            }

（3）取值

       Label1.Text = "";
        foreach (ListItem li in CheckBoxList1.Items)
        {
            if (li.Selected)
            {
                Label1.Text += li.Value + "," + li.Text + "|";
            }
        }

（4）布局
RepeatDirection 布局方向 
Vertical垂直 Horizontal水平
RepeatColumms 布局项的列数