From this blog, we started to learn about the server controls of asp.net. Although the current IT field has many attitudes towards the controls of asp.net, however, as long as a thing or thing occurs, it is inevitable that it will happen. We cannot deny this control, but we can only see that this control is used in that situation, the following describes in detail the use of these controls and their principles.
(1) ASP. NET Server Control is ASP.. NET encapsulation of HTML. txt can be used in the C # code. text = 'Han yinglong' to modify the input value, ASP. NET will render the server control into HTML code and output it to the browser. The server control is ASP. NET is very attractive to beginners, very easy to use, but also the most criticized thing, make the best of its use, the server control in the Intranet system, the background part of the Internet system is suitable for areas with low access frequency.
(2) Most of ASP. NET is inherited from the Control and WebControl classes, and almost all the members include:
1) clientID: the ID of the control on the client. the ID of the control on the server is not necessarily equal to the ID in the HTML of the client. For example, in the template of the control such as ListView, therefore, if you want to use the getElementById and $ ("# Id") of JavaScript, Dom, and Jquery on the client to operate the control, you 'd better not directly write the server ID, instead, $ ('# <% = txt. clinetID %> '). Move the mouse over the control with the Jquery event and remove the different styles from the control. You can see the difference between ClientID and ID in the user control.
1) drag and drop a TextBox Control, move the mouse to the control to become red, and leave the original state
1 <script type="text/javascript"> 2 3 function Myonload() { 4 5 document.getElementById('<%=txtRed.ClientID %>').onmouseover = function () { 6 7 this.style.background = 'Red'; 8 9 }10 11 document.getElementById('<%=txtRed.ClientID %>').onmouseout = function () {12 13 this.style.background = '';14 15 }16 17 }18 19 </script>20 21 <body onload="Myonload()">22 23 <asp:TextBox ID="txtRed" runat="server"></asp:TextBox>
2) create a new MyUserCtrl. ascx user control, drag and drop a TextBox and Button control, and write a listening event:
<script type="text/javascript">document.getElementById('<%=btnOK.ClientID %>').OnClick = function (){ document.getElementById('<%=txtShow.ClientID %>').value = "Hello,Kencery"; }</script><asp:TextBox ID="txtShow" runat="server"></asp:TextBox><asp:Button ID="btnOK" runat="server" Text="Button" />
Note: drag and drop the user control to the. aspx project for verification.
2) The Visible attribute indicates whether the control is Visible. If Visible is set to False, the control will not be rendered to HTML. This is different from the style. display = 'none' element in HTML.
3) CssClass attribute. The style name of the control is the class attribute of the control in HTML.
Note: Create a WebForm project and write the following code:
<style type="text/css"> .waring { color:Red; } </style><asp:TextBox runat="server" ID="txtColor" CssClass="waring"></asp:TextBox>
Note: drag and drop a TextBox Control and set the CssClass attribute to "waring". You can also modify attributes such as BackColor and BorderStyle separately. However, this is not recommended because many inline styles are generated, generate Html (the size is large and cannot be modified uniformly ).
4) Attributes is used to set additional properties of the control, which is the same as SetAttribute and getAttribute In the Dom.
Note: Write the following code in the Pege_Load of Default. aspx:
BtnCancel. Attributes ["a1"] = "3.jpg ";
BtnCancel. Attributes ["onmouserover"] = "alert ('kencery ')";
(1) Label control. The Text attribute is the display Text. The AssociatedControlID attribute is used to associate a control. If it is null, it is displayed as a span. If it is specified as the ID of a control, it is displayed as a <Label> in HTML and set the for attribute to the ClientID of the associated control.
Note: drag and drop a Label control and TextBox Control to set the AssociatedControllID of the Label control to the associated TextBox.
(2) The Literal control also displays a piece of Text, but the Literal control does not render any additional labels, that is, display the Text attribute.
(3) TextBox Control, Text box control, TextMode attribute values Singleline, Multiple, Password? are rendered as <input type = "Text">, textarea and <input type = "Password">. When the AutoPostBack attribute is true, the page Post will be generated when the user focus leaves the TextBox. The implementation principle is ASP. NET principle when the AutoPostBack, TextChanged event, the event triggers ASP when the text box changes. NET, it is best to call the _ doPostBack method when submitting a form.
(4) The RadioButton control is rendered as <input type = "radio"> and grouped by the GroupName attribute.
(5) The OnClientClick attribute of the Button control. The Code executed on the browser when the user clicks the Button. Note: OnClientClick is a string attribute and the written code is JavaScript code, run on the browser side.
<Asp: Button ID = "btnDelete" runat = "server" Text = "delete" OnClientClick = "return confirm ('Do you really want to delete it? "/>
(6) the usage of LinkButton is similar to that of Button. The difference is that the Button control is rendered as a Button, while the LinkButton control is rendered as a hyperlink. Do not use LinkButton to implement a normal hyperlink, because the href of the LinkButton is a piece of JavaScript code, the form is post and cannot be "opened in a new window ". The Href principle in the example of "Row deletion" is the same as that in JavaScript.
(7) The ImageButton control is similar to the Button control, but is displayed as an image and rendered as <input type = "image">.
(8) controls such as Button, LinkButton, and ImageButton have CommandName and CommandArgument attributes and Command events, allowing multiple Button controls to share a Command event handler function, read the CommandName and CommandArgument attributes of event object e to read the two parameters set on the clicked button to perform different operations. Example: Edit and delete multiple rows of data, this method is most used in the ListView control.
Note: Create a new table and delete the. aspx page.
1 <div> 2 3 <table> 4 5 <tr> 6 7 <td> Kencery </td> <td> 23 </td> <asp: button ID = "btnDelete" runat = "server" 8 9 Text = "delete" CommandName = "Remove" CommandArgument = "Kencery" 10 11 oncommand = "RemoveCommmand"/> <asp: button ID = "btnEdit" runat = "server" 12 13 Text = "Edit" oncommand = "RemoveCommmand" CommandArgument = "Kencery" CommandName = "Edit"/> </td> 14 15 </tr> 16 17 </table> 18 19 <asp: label ID = "lblShow" runat = "server"> </asp: Label> 20 21 </div>
Write the following code on the aspx. cs page:
1 protected void RemoveCommmand (object sender, CommandEventArgs e) 2 3 {4 5 if (e. commandName = "Remove") 6 7 {8 9 string name = Convert. toString (e. commandArgument); 10 11 lblShow. text = name + "deleted"; 12 13} 14 15 else if (e. commandName = "Edit") 16 17 {18 19 string name = Convert. toString (e. commandArgument); 20 21 lblShow. text = name + "edited"; 22 23} 24 25}
(9) The Panel control is used to hold some controls. If the GroupingText attribute is set, it is rendered as a <fieldset> label, that is, the GroupBox effect. Otherwise, it is rendered as a Div.
Note: drag and drop the Panel control to set the GroupBox attribute value to advanced settings.
(10) HyperLink control, HyperLink. Unlike LinkButton, it does not post data to the server, which is a hyperlink. NavigateURL: Connection address, Text: display Text. If the ImageUrl attribute is set, an image hyperlink is displayed.
(11) The FileUpload control and the file upload control are rendered as <input type = "file"/>. The attribute FileContent obtains the uploaded file in the form of a stream. The FileName Upload File Name and HasFile Bool value indicate whether the file is selected by the user. The SaveAs method is used to save the file to a specified location on the disk. vulnerability: file Upload Vulnerability (aspx ). Only files of the specified type can be uploaded. the upload Folder does not have the execution permission.
Note: drag and drop a FileUpload and Button control to upload the Button control. Double-click Button
1 protected void btnUpLoading_Click (object sender, EventArgs e) 2 3 {4 5 if (flUploading. hasFile) // whether the user has selected the file 6 7 {8 9 // Server. mapPath, VirtualPathUtility. toAbsolute can all be 10 11 string uploadPath = Server. mapPath ("~ /Upload "); 12 13 // flUploading. FileName File Uploaded Oh file name 14 15 flUploading. SaveAs (uploadPath + flUploading. FileName); 16 17} 18 19}
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
