asp.net AJAX: Writing components, using JavaScript to update UpdatePanel

As is known to all, UpdatePanel is updated by trigger. The control that is set to trigger is intercepted by the client after postback, and uses XMLHttpRequest object to send content, then server driven by ScriptManager cooperate, change Page object's output, finally get partial refresh effect. But sometimes we may need to use JavaScript to refresh UpdatePanel, which is inconvenient.

Of course, one of the ways we belong to workaround is to use JavaScript to simulate the click of a button. We tend to set a button to a UpdatePanel trigger, and then simulate its clicks on the client (I'll mention later, in fact, this is a rather bad practice, not necessary) to make the UpdatePanel update. But such a practice is too troublesome, and quite not elegant.

Now we're going to write a component to solve this problem. The name of this component, called Javascriptupdater, seems to have been very bad--I've never been good at naming.

Let's set a demand first.

Our goal is actually to generate a JavaScript proxy on the client, providing a way to refresh the page after invoking it. If a UpdatePanel UpdateMode is always, then it will definitely be updated. If you need to update UpdateMode for conditional UpdatePanel, you need to configure which UpdatePanel will be updated by writing tag in the page. We need to minimize programming as much as possible.

Let's consider the way we use it, the javascriptupdater we write can be used in this page:

How to use Javascriptupdater

　　 ResolveUpdatePanel="OnResolveUpdatePanel" Enabled="True">
　　 <UpdatePanels>
　　　　 　　　　 ...
　　 </UpdatePanels>


Javascriptupdater has a simple property methodname that indicates the name of the proxy method generated at the client. In the example above, this property is Refresh, indicating that we call the Updatepanels.refresh () method for UpdatePanel update. Updatepanels is a collection property that you can specify which updatemode to update with conditional UpdatePanel. If a updatepanelid is not found, the Resolveupdatepanel event is invoked, allowing the user to specify a UpdatePanel. There is also a enabled property that controls whether the javascriptupdater is in effect.

Multiple javascriptupdater can be placed in a single page, which allows multiple JavaScript proxy methods to be generated. Such a setting should have been sufficient.

Implement Javascriptupdater

Naturally, we first define the simplest two classes, the Updatepanelhelper.updatepanel class, and the Resolveupdatepaneleventargs class. Because it's so simple, just post the code directly: