Programming Skills Asp.net controls

Source: Internet
Author: User

In one of my projects, I need to differentiate and summarize the controls. I searched for them on the internet and added my own actual test summary as follows: (if there is anything incorrect, please even point it out and discuss it together, common progress)

The key to the convenience and quickness of Asp.net development is that it has a set of powerful control libraries, including Web server controls, Web user controls, Web custom controls, HTML server controls, and HTML controls. Here I will mainly talk about the differences between HTML controls, HTML server controls, and web server controls.

1. HTML controls: These are commonly used HTML language tags that exist on previous static pages and other webpages and cannot be controlled on the server, it can only be controlled on the client through JavaScript, VBScript, and other programming languages.
<Input type = "button" id = "BTN" value = "button"/>

2. HTML Server Control: in fact, it is the control composed of the HTML control plus runat = "server. the differences between them are that HTML controls run on the client, while HTML server controls run on the server. For more information, see ASP. when the web page is executed, the system checks whether the annotation has the runat attribute. If the annotation is not set, the HTML annotation will be treated as a string and sent to the string stream for sending to the client, the browser of the client will explain it. If the HTML annotation has the set runat = "server" attribute, the page object will put the control into the controller, and the server code will be able to control it, after the control is executed, convert the execution result of the HTML Server Control to HTML annotation, the stream is sent to the client as a string for explanation. <input id = "button" type = "button" value = "button" runat = "server"/>

3. Web Server Control: Also known as Asp.net Server Control, is a basic element of web form programming and also exclusive to Asp.net. It generates one or more HTML controls based on the client, rather than directly describing HTML elements. For example, <asp: button id = "button2" runat = "server" text = "button"/> what is the difference between it and the HTML Server Control? For more information, see the following:

1. The Asp.net Server Control provides a more unified programming interface. For example, each Asp.net Server Control has the text attribute.

2. Hide the differences between clients. In this way, programmers can focus more on their business without considering whether the client browser is IE, Firefox, or a mobile device.

3. The Asp.net server control can be saved to viewstate, so that the page can be saved when the page is uploaded back from the client to the server or downloaded from the server to the client.

4. Different event processing models: HTML tagging and HTML Server Control event processing are on the client page, while the Asp.net server control is on the server. For example:

<Input id = "button4" type = "button" value = "button" runat = "server"/> is an HTML Server Control. Click this button, the page will not be uploaded back to the server, because we have not defined a mouse click event for it.

<Input id = "button4" type = "button" value = "button" runat = "server"
Onserverclick = "test"/> we added an onserverclick event for the HTML Server Control. Clicking this button will send it back to the server and execute the test (Object sender, eventargs e) method.

<Asp: button id = "button2" runat = "server" text = "button"/> is an Asp.net Server Control and we do not define a click for it. However, when we click, the page is also sent back to the server.

It can be seen that HTML tagging and HTML server control events are triggered by pages, while Asp.net server controls are sent back to the server by pages for processing.

4. Next I will explain the problem with my own tests:

This code is stored in the repeat template. deletecheck is a JS Script Function. Note that it is used for sending the code to the server. The script code is not displayed here. <Input runat = "server" type = "button" id = "delete" value = "server button"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input runat = "server" type = "Submit" onclick = "Return deletecheck (this)" id = "button2" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button runat = "server" id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Asp: button runat = "server" id = "button5" onclientclick = "Return deletecheck (this)" text = "ASP: button"/>
The displayed HTML code is as follows: <input name = "Data $ ctl03 $ Delete" type = "button" id = "data_ctl03_delete" value = "server button"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input name = "Data $ ctl03 $ button2" type = "Submit" id = "data_ctl03_button2" onclick = "Return deletecheck (this)" value = "server submit"/>
<Input ut type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button id = "data_ctl03_button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Input type = "Submit" name = "Data $ ctl03 $ button5" value = "ASP: button" onclick = "Return deletecheck (this);" id = "data_ctl03_button5"/>

We can see the following points:

1. When the control property contains runat = "server", the name and ID of the generated HTML control change (. NET Framework ).

2. After the ASP: button server button is generated, it is converted to a client control of the submit type.

3. When the control is an HTML control, the generated page is exactly the same as the original HTML code (the reason is described above ).
In addition, I also tested to put this Code directly into the form tag (not in other child tags)

For example, <input runat = "server" type = "button" id = "delete" value = "server button" onserverclick = "delete_serverclick"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input runat = "server" type = "Submit" onclick = "Return deletecheck (this)" id = "button2" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button runat = "server" id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Asp: button runat = "server" id = "button5" onclientclick = "Return deletecheck (this)" text = "ASP: button" onclick = "button5_click"/>
<Asp: linkbutton id = "linkbutton1" runat = "server" onclick = "linkbutton1_click"> linkbutton </ASP: linkbutton> put the HTML code generated in the form tag directly.
<SCRIPT type = "text/JavaScript">
<! --
VaR theform = Document. Forms ['form1'];
If (! Theform ){
Theform = Document. form1;
}
Function _ dopostback (eventtarget, eventargument ){
If (! Theform. onsubmit (theform. onsubmit ()! = False )){
Theform. _ eventtarget. value = eventtarget;
Theform. _ eventargument. value = eventargument;
Theform. Submit ();
}
}
// -->
</SCRIPT>
<Input language = "JavaScript" onclick = "_ dopostback ('delete ','') "Name =" delete "type =" button "id =" delete "value =" server button "/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input name = "button2" type = "Submit" id = "button2" onclick = "Return deletecheck (this)" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Input type = "Submit" name = "button5" value = "ASP: button" onclick = "Return deletecheck (this);" id = "button5"/>
<A id = "linkbutton1" href = "javascript :__ dopostback ('linkbutton1','') "> linkbutton </a>

Here we can see the following points:

1. When the HTML Server Control adds a server event to the server, the generated code becomes onclick = "_ dopostback ()", in fact, the script is called to submit the entire form to the server (if a server event is not added but runat = "server" is added, it will not be sent to the server) note that if you want to add a client event in the HTML server control as shown in <input runat = "server" type = "button" id = "delete" value = "server button" onserverclick = "delete_serverclick"/>
<Input runat = "server" type = "button" id = "delete" value = "server button" onclick = "Return deletecheck (this)" onserverclick = "delete_serverclick"/>
The generated HTML code becomes <input language = "JavaScript" onclick = "Return deletecheck (this) _ dopostback ('delete ','') "Name =" delete "type =" button "id =" delete "value =" server button "/> indicates a script error because the onclick event executes two scripts and the format is incorrect. Onclick = "Return deletecheck (this); _ dopostback ()" in this way, only the first function can be executed, and the second function cannot be executed (return ). if onclick = "Return deletecheck (this) is used, _ dopostback ()" means that the execution of both functions has no effect (equivalent to a statement ). In one of my projects, I need to differentiate and summarize the controls. I searched for them on the internet and added my own actual test summary as follows: (if there is anything incorrect, please even point it out and discuss it together, common progress)

The key to the convenience and quickness of Asp.net development is that it has a set of powerful control libraries, including Web server controls, Web user controls, Web custom controls, HTML server controls, and HTML controls. Here I will mainly talk about the differences between HTML controls, HTML server controls, and web server controls.

1. HTML controls: These are commonly used HTML language tags that exist on previous static pages and other webpages and cannot be controlled on the server, it can only be controlled on the client through JavaScript, VBScript, and other programming languages.
<Input type = "button" id = "BTN" value = "button"/>

2. HTML Server Control: in fact, it is the control composed of the HTML control plus runat = "server. the differences between them are that HTML controls run on the client, while HTML server controls run on the server. For more information, see ASP. when the web page is executed, the system checks whether the annotation has the runat attribute. If the annotation is not set, the HTML annotation will be treated as a string and sent to the string stream for sending to the client, the browser of the client will explain it. If the HTML annotation has the set runat = "server" attribute, the page object will put the control into the controller, and the server code will be able to control it, after the control is executed, convert the execution result of the HTML Server Control to HTML annotation, the stream is sent to the client as a string for explanation. <input id = "button" type = "button" value = "button" runat = "server"/>

3. Web Server Control: Also known as Asp.net Server Control, is a basic element of web form programming and also exclusive to Asp.net. It generates one or more HTML controls based on the client, rather than directly describing HTML elements. For example, <asp: button id = "button2" runat = "server" text = "button"/> what is the difference between it and the HTML Server Control? For more information, see the following:

1. The Asp.net Server Control provides a more unified programming interface. For example, each Asp.net Server Control has the text attribute.

2. Hide the differences between clients. In this way, programmers can focus more on their business without considering whether the client browser is IE, Firefox, or a mobile device.

3. The Asp.net server control can be saved to viewstate, so that the page can be saved when the page is uploaded back from the client to the server or downloaded from the server to the client.

4. Different event processing models: HTML tagging and HTML Server Control event processing are on the client page, while the Asp.net server control is on the server. For example:

<Input id = "button4" type = "button" value = "button" runat = "server"/> is an HTML Server Control. Click this button, the page will not be uploaded back to the server, because we have not defined a mouse click event for it.

<Input id = "button4" type = "button" value = "button" runat = "server"
Onserverclick = "test"/> we added an onserverclick event for the HTML Server Control. Clicking this button will send it back to the server and execute the test (Object sender, eventargs e) method.

<Asp: button id = "button2" runat = "server" text = "button"/> is an Asp.net Server Control and we do not define a click for it. However, when we click, the page is also sent back to the server.

It can be seen that HTML tagging and HTML server control events are triggered by pages, while Asp.net server controls are sent back to the server by pages for processing.

4. Next I will explain the problem with my own tests:

This code is stored in the repeat template. deletecheck is a JS Script Function. Note that it is used for sending the code to the server. The script code is not displayed here. <Input runat = "server" type = "button" id = "delete" value = "server button"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input runat = "server" type = "Submit" onclick = "Return deletecheck (this)" id = "button2" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button runat = "server" id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Asp: button runat = "server" id = "button5" onclientclick = "Return deletecheck (this)" text = "ASP: button"/>
The displayed HTML code is as follows: <input name = "Data $ ctl03 $ Delete" type = "button" id = "data_ctl03_delete" value = "server button"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input name = "Data $ ctl03 $ button2" type = "Submit" id = "data_ctl03_button2" onclick = "Return deletecheck (this)" value = "server submit"/>
<Input ut type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button id = "data_ctl03_button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Input type = "Submit" name = "Data $ ctl03 $ button5" value = "ASP: button" onclick = "Return deletecheck (this);" id = "data_ctl03_button5"/>

We can see the following points:

1. When the control property contains runat = "server", the name and ID of the generated HTML control change (. NET Framework ).

2. After the ASP: button server button is generated, it is converted to a client control of the submit type.

3. When the control is an HTML control, the generated page is exactly the same as the original HTML code (the reason is described above ).
In addition, I also tested to put this Code directly into the form tag (not in other child tags)

For example, <input runat = "server" type = "button" id = "delete" value = "server button" onserverclick = "delete_serverclick"/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input runat = "server" type = "Submit" onclick = "Return deletecheck (this)" id = "button2" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button runat = "server" id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Asp: button runat = "server" id = "button5" onclientclick = "Return deletecheck (this)" text = "ASP: button" onclick = "button5_click"/>
<Asp: linkbutton id = "linkbutton1" runat = "server" onclick = "linkbutton1_click"> linkbutton </ASP: linkbutton> put the HTML code generated in the form tag directly.
<SCRIPT type = "text/JavaScript">
<! --
VaR theform = Document. Forms ['form1'];
If (! Theform ){
Theform = Document. form1;
}
Function _ dopostback (eventtarget, eventargument ){
If (! Theform. onsubmit (theform. onsubmit ()! = False )){
Theform. _ eventtarget. value = eventtarget;
Theform. _ eventargument. value = eventargument;
Theform. Submit ();
}
}
// -->
</SCRIPT>
<Input language = "JavaScript" onclick = "_ dopostback ('delete ','') "Name =" delete "type =" button "id =" delete "value =" server button "/>
<Input type = "button" onclick = "Return deletecheck (this)" id = "button1" value = "client button"/>
<Input name = "button2" type = "Submit" id = "button2" onclick = "Return deletecheck (this)" value = "server submit"/>
<Input type = "Submit" onclick = "Return deletecheck (this)" id = "button3" value = "client submit"/>
<Button id = "button4" onclick = "Return deletecheck (this)" value = "button-button"> button-button </button>
<Input type = "Submit" name = "button5" value = "ASP: button" onclick = "Return deletecheck (this);" id = "button5"/>
<A id = "linkbutton1" href = "javascript :__ dopostback ('linkbutton1','') "> linkbutton </a>

Here we can see the following points:

1. When the HTML Server Control adds a server event to the server, the generated code becomes onclick = "_ dopostback ()", in fact, the script is called to submit the entire form to the server (if a server event is not added but runat = "server" is added, it will not be sent to the server) note that if you want to add a client event in the HTML server control as shown in <input runat = "server" type = "button" id = "delete" value = "server button" onserverclick = "delete_serverclick"/>
<Input runat = "server" type = "button" id = "delete" value = "server button" onclick = "Return deletecheck (this)" onserverclick = "delete_serverclick"/>
The generated HTML code becomes <input language = "JavaScript" onclick = "Return deletecheck (this) _ dopostback ('delete ','') "Name =" delete "type =" button "id =" delete "value =" server button "/> indicates a script error because the onclick event executes two scripts and the format is incorrect. Onclick = "Return deletecheck (this); _ dopostback ()" in this way, only the first function can be executed, and the second function cannot be executed (return ). if onclick = "Return deletecheck (this) is used, _ dopostback ()" means that the execution of both functions has no effect (equivalent to a statement ).

2. The control name hasn't changed. I don't quite understand why it hasn't changed.

3. ASP: The onclientclick event in the button is generated and becomes an onclick event. The type is changed to type = "Submit ". however, The onclick of a server event is sent to the server for execution (I am not quite sure ).

4. Linkbutton does not define an onclick event. It automatically generates the following code and sends it to the server. Href = "javascript :__ dopostback ('linkbutton1 ','') "is a brief introduction to the Asp.net control. This is just a summary of my personal point of view. If you have any incorrect ideas, we can all discuss and make progress together.

2. The control name hasn't changed. I don't quite understand why it hasn't changed.

3. ASP: The onclientclick event in the button is generated and becomes an onclick event. The type is changed to type = "Submit ". however, The onclick of a server event is sent to the server for execution (I am not quite sure ).

4. Linkbutton does not define an onclick event. It automatically generates the following code and sends it to the server. Href = "javascript :__ dopostback ('linkbutton1 ','') "is a brief introduction to the Asp.net control. This is just a summary of my personal point of view. If you have any incorrect ideas, we can all discuss and make progress together.
 
 
 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.