WebForm 简单控件、复合控件

时间:2022-11-15 00:04:45

简单控件:

Label:被编译成span

  样式表里设置lable的高度:  display:inline-block;
  Text  --文本
  ForeColor  --字体颜色
  Visible  --权限时使用
  CssClass  --样式表

Literal:无任何元素,只会在其位置上将Text内容完全展示出来(例如:输出js代码)
  重要属性只有:Text  --文本

TextBox: 不一定被编译成什么元素
  属性:Text  --文本

       TextMode - 它设置为什么值,被编译后将会是不同的一些表单元素

      SingleLine  --文本框

      MultiLine  --文本域

      Password  --密码框

      Number  --只能是数字,可以点击上下三角号进行加减

Button: 被编译成提交按钮 submit
ImageButton:被编译成图片按钮 image,有提交功能
LinkButton:超链接模样的按钮,有提交按钮的作用。被编译的内容较复杂

    属性:OnClientClick是执行客户端脚本(js),客户端执行优先级高于服务端

表单元素:

文本类:  --简单控件
文本框:<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" />

复合控件:

RadioButton:  (例如:男/女)

  两个radiobutton ,用groupname进行分组

  设置默认选择项  checked="true"

表单中:radio   使用name进行分组

<input type="radio" id="nan" name="sex"><lable for="nan">男</lable>

<input type="radio" id="nv" name="sex"><lable for="nv">女</lable>

RadionButtonList:(必须使用)

  默认就是一组

  默认选中项: selected="true"

  布局:属性可以设置垂直排列还是水平排列

复合控件三步:

  1、将数据绑定上去(例如:民族表)

  遍历:

  RadionButtonList 内为空的

    foreach(Nation n in list)

    {

      Listitem li =new Listitem(n.NationName,n.NationCode);

      RadioButton1.Items.Add(li);

    }

  数据绑定:

    if(!IsPostBack)

    {

      RadioButton1.DataSource=list;

      RadioButton1.DataTextFiled="NationName";
      RadioButton1.DataValueFiled="NationCode";

      RadioButton1.DataBind();

    }

  2、设置默认选中项

    RadioButton1.SelectedIndex=1;

    RadioButton1.SelectedValue="N001";

  3、将选中数据取出来

    委托事件:

    ListItem li=RadioButtonList1.SelectdItem;

    Lable.Text=li.Value+","+li.Text;

CheckBoxList:(类似于RadionButtonList)

DropDownList:(类似于RadionButtonList)