Shulou(Shulou.com)06/02 Report--

This article mainly introduces how to add client functions to server controls in ASP.NET, which has a certain reference value, and interested friends can refer to it. I hope you will gain a lot after reading this article.

Server control client function based on ASP.NET control development 1. Reduce server pressure and increase user experience

The server function is powerful, the client script is not weak, the current ajax technology and Atlas technology is the proof of *, we always expect UI to have a good effect, flash animation brings us a very cool effect, we can at least add client script for our server controls, on the one hand reduce server-side backhaul, on the other hand can provide a very cool effect for the control. I think we all like a lot of cool controls in ATLAS, and without refresh, server controls interact with client script, which makes server controls more *.

After the above nonsense, let's get down to business.

Server control client function based on ASP.NET control development 2. Simply add client script to the server control

We have learned that the rendered code of the server control is still HTML. As long as you are familiar with the rendered label of the server control and its elements, you can add it directly to the server control.

Properties, events, styles, etc.

A simple way to add is as follows:

(1) add properties directly to the control, such as adding simple client events to the Button control

< asp:Button ID= "Button2" runat= "server" Text= "Button" onmouseover=this.value=' mouse over'"onmouseout=this.value=' mouse leave'" / >

(2) use AttributeCollection to add simple client events in the background. Typically, when we delete data, a window always pops up to remind the user whether to delete it.

Button2.Attributes.Add ("onmouseover", "this.value=' mouse over'"); Button2.Attributes.Add ("onmouseout", "this.value=' mouse away'")

Server control client function based on ASP.NET control development 3. Complex client function processing

Regardless of the server-side function, when the client script is complex, we will write it in a js file that can be reused, and simple script logic can be in the < script > tag. We need packaging.

The page class provides us with several methods to implement the following, but it is important to note that asp.net2.0 adds a new class ClientScriptManager, which is specifically used to manage client script methods, using the following methods

ClientScriptManager = Page.ClientScript

(1) Register script library (js file)

RegisterClientScriptInclude method

(2) issue scripts at the top and end of the page

RegisterStartupScript method and RegisterClientScriptBlock method

(3) make sure that the script block appears only once on the page

Four ways to end with Is leading Registered

(4) associate the control event handler with the client submission event

RegisterOnSubmitStatement method

(5) register an array to store the variables of the control itself

RegisterArrayDeclaration method

(6) register a hidden domain

RegisterHiddenField method

For the specific use of the above methods MSDN are given specific examples, just look at the method name is relatively long, after contact will feel simple, the use of the above methods must be understood. If you don't want to read MSDN, then I recommend the following articles, which will be of great help to you. It is also suggested that you can take a look at the rendered HTML code, which will deepen your understanding.

Insert client script from an ASP.NET server control

Use client script

Server control client function based on ASP.NET control development 4. Learn about pre-rendered PreRender events

Here we still talk about the lifecycle of the control. Before the control renders the Render method, there is also a pre-rendered OnPreRender method. Its cycle is explained by MSDN after OnLoad.

Perform any updates before rendering the output. Changes made to the state of the control at the presupposition stage can be saved, while changes made during the rendering phase will be lost

To sum up, it is always very simple. If we want to understand it deeply, we still need to try it and come back to experience the above sentence.

First look at a simple example, rewrite Page_PreRender on the page, assign a value to label1 in its event, and then define the button event. You will find that the value of label remains the same after the button event is triggered.

Server control client function example on the basis of ASP.NET control development

Protected void Page_PreRender (object sender, EventArgs e) {Label1.Text= "PreRender";} protected void Button1_Click (object sender, EventArgs e) {Label1.Text= "Click";}

To understand the above sentence, maybe we thought, why not implement it in the Render method at render time? If you do this, you will be dead.

We also need to make it clear that different events are responsible for different things, and the Render method is only responsible for rendering, do not leave anything else to him to do.

You can add properties to the control that need to be rendered in the Render method, but other things need to be done before rendering. The whole control cycle has stages, and different stages accomplish different things.

What we are talking about this time is to add client script to the server control, so we should call the method of the ClientScriptManager class when the control is appropriate. And this appropriate time is the OnPreRender method.

ASP.NET control development foundation server control client function 5. Add client script to a custom control

(1) simple implementation: you can re-OnPreRender method, and then use AttributeCollection's Add method to add simple client script

Protected override void OnPreRender (EventArgs e) {base.OnPreRender (e); Attributes.Add ("onclick", "alert ('" + ClickText + ");");}

(2) complex implementation: here we use an example or simple, the effect or button confirmation before there is a pop-up window, it is important for everyone to understand the use of several methods in the ClientScriptManager class, the following code uses asp.net server control development technology and instance examples 2, I am lazy, directly use several methods in Page.

The code is listed below

The second example of server control client function on the basis of ASP.NET control development

/ * / < summary > / NormalButton is displayed as a normal style button. / / when the user clicks the button, a confirmation dialog box pops up to determine its action. / is usually used to confirm whether the user really wants to delete / modify and so on. / / < / summary > [ToolboxData ("< {0}: NormalButton runat=server > < / {0}: NormalButton >")] public class NormalButton: Button {private string _ scriptPath = "ControlClientScript/"; / / constructor public NormalButton (): base () {Message = "are you sure you want to do this?" ;} definition property # region definition property [Bindable (true), Category ("Appearance"), DefaultValue ("are you sure you want to do this?") , Description ("Custom prompt")] public string Message {get {return (string) ViewState ["Message"];} set {ViewState ["Message"] = value }} [Category ("Other"), DefaultValue ("ControlClientScript/"), Description ("script path")] public String ScriptPath {get {return _ scriptPath } set {_ scriptPath = value;}} # endregion / / override AddAttributesToRender method protected override void AddAttributesToRender (HtmlTextWriter output) {Attributes.Add ("confirmationmessage", Message); base.AddAttributesToRender (output) } / / override the OnPreRender method protected override void OnPreRender (EventArgs e) {Page.RegisterClientScriptBlock ("WebUIConfirmation", "< script language='javascript' src='" + ScriptPath + "WebUIConfirmation.js" + "'> < / script >") Page.RegisterArrayDeclaration ("Page_Confirmations", "'" + ClientID + "'"); Page.RegisterStartupScript ("WebUIConfirmationStartup", "< script language='javascript' src='" + ScriptPath + "WebUIConfirmationStartup.js" + "'> < / script >"); base.OnPreRender (e) }}

Mainly look at the OnPreRender method, as long as you are familiar with several of its methods, then the rest is your mastery of javaScript. It can be said that it is easy to master the above methods, but it takes a lot of accumulation to master javaScript, so it is not easy to develop a good control.

The js file is listed below, which I have changed.

WebUIConfirmationStartup.js ConfirmationOnLoad (); WebUIConfirmation.js / / String blanks String.prototype.Trim = function () {return this.replace (/ (^\ s*) | (\ sroom$) / g, ");} / / initialize the acquisition control ID function ConfirmationOnLoad () {if (typeof (Page_Confirmations) = =" undefined ") return; var i, confirmButton; for (I = 0; I < Page_Confirmations.length) ConfirmButton +) {confirmButton = Page_ packages [I]; if (typeof (confirmButton) = = "string") {confirmButton = document.getElementById (confirmButton) } if (typeof (confirmButton.confirmationmessage)! = "undefined") {if (confirmButton.attributes ["confirmationmessage"]. Value.Trim ()! = "") {confirmButton.confirmationmessage = confirmButton.attributes ["confirmationmessage"] .value;} else {confirmButton.confirmationmessage = "are you sure you want to do this?" ;}} ConfirmationHookupControl (confirmButton);}} / / add onclick event function ConfirmationHookupControl (confirmButton) {var ev = confirmButton.onclick; if (typeof (ev) = = "function") {ev = ev.toString (); ev = ev.substring (ev.indexOf ("{") + 1, ev.lastIndexOf ("}")) } else {ev = "";} var func = new Function ("if (! ConfirmationOnClick (this)) {return false;}" + ev); confirmButton.onclick = func;} / / pop-up confirmation window function ConfirmationOnClick (confirmButton) {return window.confirm (confirmButton.confirmationmessage);}

OK, the above server control code is quite simple, if you can read JS, then this effect is not a problem. To tell you the truth, the difficulty lies in the JavaScript script, hehe.

Here is another example, which is also an example of asp.net server control development technology and example, is a scalable panel control, which is a collection property and client script together to achieve the effect

But this control does not use js script on the rendering page, and does not rewrite the OnPreRender method, but defines a HTC, the key implementation of which is the implementation of the collection properties of the server control, and the implementation of the client script, the specific code can be downloaded later.

Other issues that need to be paid attention to on the basis of server control client functions for ASP.NET control development:

1. The most frequent use of client script in server controls is the use of validation controls. You can also customize validation controls, but I don't think it is very useful. If you need to, you can learn about System.Web.UI.IValidator interfaces and System.Web.UI.WebControls.BaseValidator classes.

two。 In addition, there is client callback, you can learn about the ICallbackEventHandler interface, or see the related articles or MSDN.

OK, I have finished another article. If you have just come into contact with these things, it will still be helpful to you. If you have already understood it, what I said above will be very simple for you. Still want to say that, the key lies in your proficiency in JavaScript. There are some things you still need to dig for yourself.

Thank you for reading this article carefully. I hope the article "how to add client functions to server controls in ASP.NET" shared by the editor will be helpful to you. At the same time, I also hope you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.