Click here to Skip to main content
14,875,917 members
Articles / Web Development / IIS
Posted 3 Sep 2007


92 bookmarked

Web Page Source Transmitter: Get The Page As The Customer Sees It

Rate me:
Please Sign up or sign in to vote.
4.88/5 (23 votes)
3 Sep 2007CPOL5 min read
This article describes a control that allows getting a web page as the customer sees it. E.g., the developer can store the copy of the page as it was before an exception and restore the page when it's required.


Web applications without bugs - it is a myth.

Every developer has many problems when he should reproduce a customer's bug. Usually, the customer cannot provide enough information about conditions before an exception (field values he entered; page which was opened before an exception, etc.).

It will be very useful if the application can produce (restore) the source of the opened web page with the data entered, as it was before an exception and store it (e.g. into a database). In this case, the developer can get the source of the page (e.g. from the database), put it to an HTML file and open it in a browser. The developer will get a copy of the page as it was before the exception.

I implemented this functionality as a non-visual control.


When I started this project, I thought that I could use implementation of IHttpModule to intercept the HTML source, that application would be sent to the client and it would be enough. But an AJAX-enabled application sends only part of the changed page to the client. In this case, I should merge full render and partial renders to get the actual state of the page - it is inconvenient.

Unfortunately, this solution does not allow including changed fields and other changes (e.g., caused by JavaScript) to the source. Moreover, I should parse HTML code off and set changed values. In my opinion, it is a complex solution.

Then, I decided to take another approach to this problem. I can gather the HTML source, changed fields, etc. on the client side and send it to the server!

Using the control

Adding the control to a web page is very simple. In VS.NET, you should select the control's DLL file (PauSoft.Web.dll) using 'Add/Remove Toolbox Items'. The control will appear in the toolbox and you can add it to a page.

Note: Only one instance of the control can be added to the Page or MasterPage.


Design-time view of the 'HtmlSourceTransmitter' control

The designer of the control is very simple.

At design-time, the developer has access to the Enabled property. By default it is true, but the developer can switch it to false to turn off the functionality of the control (it can be useful to decrease the size of the HTTP request on production, when all bugs have been fixed).

If the developer has a master page in the application, he can add the control to the master page.

If the developer has a hierarchy of pages or master pages, he can add the control to the beginning of the hierarchy at run-time.


The following code describes how to use the control:

ASP.NET Master Page declaration

<%@ Register Assembly="PauSoft.Web" Namespace="PauSoft.Web.UI.Controls" 
                        TagPrefix="psControls" %>

<psControls:HtmlSourceTransmitter ID="HtmlSourceTransmitter1" runat="server">

ASP.NET Master Page code-behind class

public partial class Site1 : System.Web.UI.MasterPage
  protected void Page_Load(object sender, EventArgs e)
    if (!Page.IsPostBack)
      string htmlSource = HtmlSourceTransmitter1.HtmlSource;
      //store htmlSource to DB, file etc

Creating Control at Run-Time

There is no problem to create a control at run-time.

The following code will add one HtmlSourceTransmitter on the page and propose an easy way to get access to the HTML source.

public partial class _Default : MyCustomPage
  private HtmlSourceTransmitter _htmlTransmitter = 
                    new HtmlSourceTransmitter();

  protected override void OnInit(EventArgs e)

  /// <span class="code-SummaryComment"><summary /></span>
  /// Returns HTML source of the page before submit.
  /// <span class="code-SummaryComment"></summary /></span>
  public string HtmlSource
      return _htmlTransmitter.HtmlSource;

How does it work?

There are some steps of an HTML source transmitting from a client to a server.

Step 1

On OnPrerender event, the control checks Enabled property and registers scripts, if the property value is true.

public class HtmlSourceTransmitter : Control
  protected override void OnPreRender(EventArgs e)

    if (Enabled)

Step 2

The control registers the JavaScript handler that will be executed on OnSubmit event on the client side, and the hidden field that will contain transmitting HTML code.

public class HtmlSourceTransmitter : Control
  private void RegisterScripts()
    //Register script from .js file depends on current compile mode 
    //(debug/release) of web application

    //Register action, that will be executed on Form OnSubmit event
    string scriptName = string.Format(CultureInfo.InvariantCulture, 
                        "{0}_OnSubmit", ClientID);
    string scriptText = "FillTransmitterField()";
    if (!Page.ClientScript.IsOnSubmitStatementRegistered
                        (GetType(), scriptName))
                        scriptName, scriptText);

    //Register hidden field, that will keep HTML source of the page
    Page.ClientScript.RegisterHiddenField(transmitterFieldName, string.Empty);

Step 3

On OnSubmit event, the FillTransmitterField() function will be executed and it will generate an update script for the changed elements, add this script to OnLoad of Body element and store the HTML source of the page to a hidden field and, finally, send data to the server (see "HtmlSourceTransmitter.debug.js" file).

Step 4

The developer uses incoming information as he likes.


Below you will find examples of the control usage:

Screenshot of first web page

Fig. 1. Screenshot of the first sample web page

Result of HtmlSourceTransmitter work for first web page.

Fig. 2. View of the first sample page that has been got using HtmlSourceTransmitter

Screenshot of second web page

Fig. 3. Screenshot of the second sample web page

Result of HtmlSourceTransmitter work for second web page.

Fig. 4. View of the second sample page, that has been got using HtmlSourceTransmitter

You can compare screenshots and views - they are almost similar!

Who can use it?

In my opinion, almost all users are the same - they are forgetful. In this case, it is very useful to have a "screenshot" of the page before an exception. This control is useful for developers, who should catch server bugs, when users cannot describe in detail the situation before the bug.

Almost all of us have experienced the described situation and this control can help us to solve our problems!

Known Issues

  1. HtmlSourceTransmitter does not work well with TabStrip control from Microsoft IE WebControls library.
  2. This control stores only the HTML code of the displayed page and does not store external resources - images, scripts, cascading styles etc. Therefore, the developer should create an HTML file with the received source in the application folder to get the best result.
  3. The layout of the page, that has been got using HtmlSourceTransmitter, can differ from the layout of original.

I am sure, there are some other things that need to be modified or some other functionality that needs to be added. So, please let me know.


Thanks to the following people who helped me:

  • Vladimir Kuznetsov
  • Yan Oreshchenkov
  • Sergey Zyrianov


  • Version 1.0 (2007-08-30) - Initial release


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Max Paulousky
Team Leader
Belarus Belarus
Max currently is a senior developer at software company.

He lives with his wife Tatiana and son Zakhar (4 yrs) in Minsk, Belarus, but they dream to live in New Zealand.

Comments and Discussions

GeneralHtmlSourceTransmitter1.HtmlSource is always empty Pin
K32119-Sep-08 9:25
MemberK32119-Sep-08 9:25 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
Max Paulousky21-Sep-08 21:41
MemberMax Paulousky21-Sep-08 21:41 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
K32122-Sep-08 2:57
MemberK32122-Sep-08 2:57 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
Max Paulousky25-Sep-08 2:35
MemberMax Paulousky25-Sep-08 2:35 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
K32125-Sep-08 7:49
MemberK32125-Sep-08 7:49 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
Max Paulousky26-Sep-08 1:52
MemberMax Paulousky26-Sep-08 1:52 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
K32129-Sep-08 2:03
MemberK32129-Sep-08 2:03 
GeneralRe: HtmlSourceTransmitter1.HtmlSource is always empty Pin
Max Paulousky29-Sep-08 5:34
MemberMax Paulousky29-Sep-08 5:34 
GeneralNice Idea... Pin
raam_kimi8-Jan-08 22:21
Memberraam_kimi8-Jan-08 22:21 
GeneralRe: Nice Idea... Pin
Max Paulousky9-Jan-08 0:15
MemberMax Paulousky9-Jan-08 0:15 
GeneralNice one !!! Pin
Abhijit Jana2-Jan-08 4:25
professionalAbhijit Jana2-Jan-08 4:25 
GeneralScreen Shot to Mail Pin
pganathe8-Oct-07 22:30
Memberpganathe8-Oct-07 22:30 
GeneralRe: Screen Shot to Mail Pin
Max Paulousky9-Oct-07 2:59
MemberMax Paulousky9-Oct-07 2:59 
GeneralRe: Screen Shot to Mail Pin
pganathe9-Oct-07 3:13
Memberpganathe9-Oct-07 3:13 
GeneralRe: Screen Shot to Mail Pin
Max Paulousky11-Oct-07 22:13
MemberMax Paulousky11-Oct-07 22:13 
GeneralScreen Shot to Mail Pin
pganathe11-Oct-07 22:24
Memberpganathe11-Oct-07 22:24 
Generalwhy log all the extra html size Pin
Thanks for all the fish14-Sep-07 3:07
MemberThanks for all the fish14-Sep-07 3:07 
GeneralRe: why log all the extra html size Pin
Max Paulousky14-Sep-07 3:29
MemberMax Paulousky14-Sep-07 3:29 
GeneralPauSoft.Web.dll Pin
Michael Sync3-Sep-07 20:41
MemberMichael Sync3-Sep-07 20:41 
GeneralRe: PauSoft.Web.dll Pin
Max Paulousky3-Sep-07 22:28
MemberMax Paulousky3-Sep-07 22:28 
GeneralRe: PauSoft.Web.dll Pin
Michael Sync3-Sep-07 23:13
MemberMichael Sync3-Sep-07 23:13 
GeneralRe: PauSoft.Web.dll Pin
Max Paulousky3-Sep-07 23:17
MemberMax Paulousky3-Sep-07 23:17 
GeneralGreat Idea Pin
merlin9813-Sep-07 3:41
professionalmerlin9813-Sep-07 3:41 
AnswerRe: Great Idea Pin
Max Paulousky3-Sep-07 4:39
MemberMax Paulousky3-Sep-07 4:39 
GeneralRe: Great Idea Pin
Ben Daniel3-Sep-07 12:57
MemberBen Daniel3-Sep-07 12:57 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.