HTML控件用法

htmlGeneric:(只有此控件的TagName可以修改)

<span id="MyControl" runat="server">Generic Control Content</span>

htmlAnchor :
<a href="html_anchor.aspx" id="MyControl" runat="server">My Anchor Control</a>

htmlImage:
<img src="PlayButton.gif" id="MyControl" border="10" runat="server"/>

htmlForm:
<form runat="server">
...
</form>
注:若使用HtmlInputFile或<input type="file">必须对enctype属性进行设置以允许文件能上传到服务

器
<form enctype="multipart/form-data" runat="server">

htmlButton:
<button id="MyControl">My HTML Button</button>
注:此控件与<input type="button">不同的是htmlbutton控件是一个容器控件例如:
<button id="aa" accesskey="R" style="..." runat="server">
   <img id="..." src="..."<br/><u>R</u>emove
</button>

htmlInputButton:
<input name="MySubmit" id="MySubmit" type="submit" runat="server" />
<input name="MyReset" id="MyReset" type="reset" runat="server"/>
<input name="MyButton" id="MyButton" type="button" value="My Caption" runat="server"/>
注:name多用于客户端识别控件,而id用于服务器识别相应控件变量,value则是显示button上的值

htmlInputText:
<input type="text" name="MyControl" id="MyControl" value="My HTML Textbox" maxlength="50"

size="60" runat="server"/>

htmlInputCheckBox:
<input name="MyControl" id="MyControl" type="checkbox" value="aaa" /> My Checkbox Control

htmlInputRadioButton:
<input value="MyControl" name="MyGroup" id="MyControl" type="radio" /> My RadioButton

Control
注:为了在窗体上创建一组互斥的选项按钮,必须给每个单选按钮的name属性设置相同的值!

htmlInputImage:(功能和Submit按钮类似)
<input src="ClickmeButton.gif" name="MyControl" id="MyControl" type="image" align="Middle"

border="10" />

htmlInputFile:(用于上传文件)
<input  type="file" name="MyControl" id="MyControl" accept="img/jpeg" />
注:一个简单的用于上传文件的代码.
   <form enctype="multipart/form-data" runat="server">
    Select File:
     <input type="file" id="MyFileInput" accept="image/*" runat="server"/>
     <input type="button" id="SubmitButton" value="Upload Image" runat="server"            

 onserverclick="UploadFile"/>
    </from>
    <div id="outError" runat="server"/>
    ...
    <script Language="c#">
      private void Page_Load()
       {
           if(MyFileInput.PostedFile !=null)
          {
                try{
                        MyFileInput.PostedFile.SaveAs("c:/temp/uploaded.jpg");
                   }
                  catch(Exception objError)
                 {
                    outError.InnerHtml = "Error saving file"+objError.Message;  
                 }
         

          }
       }

    </script>
  关键是 一个有正确enctype属性值的表单,一个htmlInputFile控件和一个启动该进程的按钮
除此以外,还要对web.config和machine.config的<system.web>部分中的<httpRuntime>元素的

maxRequestLength值进行修改.

htmlInputHidden:
<input name="MyControl" id="MyControl" type="hidden" value="aaa" runat="server"/>

htmlSelect:
<select name="MyControl" id="MyControl">
 <option selected="selected" value="28.33">Sun</option>//每一项均是一个ListItem对象
 <option value="55">IBM</option>
 <option value="41.1">Oracle</option>
 <option value="49.56">Microsoft</option>
 <option value="20.74">Compaq</option>
</select>
注:此处设置数据源为哈西表.其中设置了DataTextField为Key值,而DataValueField为Value值.哈西表中

的一项表示为: ("Sun",28.33)

htmlTextArea:
<textarea name="MyControl" id="MyControl" cols="30" rows="10" runat="server">My TextArea

Control</textarea>
注:此控件的值是控件的内容

htmlTable(htmlTableRow,htmlTableCell):
<table id="MyControl" runat="server"/>
代码:
int intRows = Convert.ToInt32(selRows.Value);
int intCols = Convert.ToInt32(selCols.Value);
int intRowCount;
int intColCount;
HtmlTableRow objRow;
HtmlTableCell objCell;

for (intRowCount = 0; intRowCount <= intRows - 1; intRowCount++)
{
objRow = new HtmlTableRow();

for (intColCount = 0; intColCount <= intCols - 1; intColCount++)
{
objCell = new HtmlTableCell();
objCell.InnerHtml = "R" + intRowCount + "C" + intColCount;
objRow.Cells.Add(objCell);
}
MyControl.Rows.Add(objRow);
}

以上是html控件的用法,下面是有关它们产生的事件处理:
ServerClick事件:
由HtmlAnchor,HtmlButton,HtmlInputButton和HtmlInputImage控件产生的.
代码:
<form runat="server">

<input id="MyButton" type="button" value="My Button"
onserverclick="MyCode" runat="server" /> &nbsp;

<input id="MySubmitButton" type="submit" value="My Submit Button"
onserverclick="MyCode" runat="server" /> &nbsp;

<input id="MyImageButton" type="image" src="ClickmeButton.gif" align="absbottom"
onserverclick="MyImageCode" runat="server" />

</form>

<div id="divResult" runat="server" enableviewstate="false" />

<script runat="server">

void MyCode(Object objSender, EventArgs e)
//其中objSender是产生这个事件的对象(页面中的一个按钮控件)的引用,
//e是该对象包含这个事件的更多信息
{
Control c = (Control)objSender;
divResult.InnerHtml += "ServerClick event detected in control '"
+ c.ID + "'<br />";//此处引用了控件的ID
}

void MyImageCode(Object objSender, ImageClickEventArgs objArgs)

{
HtmlInputImage c = (HtmlInputImage)objSender;
divResult.InnerHtml += "ServerClick event detected in control '"
+ c.ID + "' at X=" + objArgs.X
+ " Y=" + objArgs.Y + "<br />";
}

</script>

ServerChange事件:
主要由HtmlInputText,HtmlInputCheckBox,HtmlInputRadioButton,HtmlInputHidden,HtmlTextArea和

HtmlSelect控件激发.
例子:
<form runat="server">

<input id="MyText" type="text" value="OriginalValue"
onserverchange="MyCode" runat="server" /> &nbsp;

<select id="MyListBox" onserverchange="MyListCode" runat="server">
<option value="Value 1">Option 1</option>
<option value="Value 2">Option 2</option>
<option value="Value 3">Option 3</option>
</select> &nbsp;

<input id="MyCheckBox" type="checkbox"
onserverchange="MyCode" runat="server" /> &nbsp;

<input type="submit" value="Submit" />

</form>

<div id="divResult" runat="server" enableviewstate="false" /><p />
<div class="cite">Change the values in the controls and click 'Submit'</div>

<script runat="server">

void MyCode(Object objSender, EventArgs e)
{
Control c = (Control)objSender;
divResult.InnerHtml += "ServerChange event detected for control '"
+ c.ID + "'<br />";
}

void MyListCode(Object objSender, EventArgs e)
{
HtmlSelect c = (HtmlSelect)objSender;
divResult.InnerHtml += "ServerChange event detected for control '"
+ c.ID + "'<br />SelectedIndex is '"
+ c.SelectedIndex
+ "', selected item text is '"
+ c.Items[c.SelectedIndex].Text
+ "', selected item value is '"
+ c.Items[c.SelectedIndex].Value + "'<br />";
}

</script>