AutoPostBack - What it is and How it works ?

What is AutoPostBack?

For understanding AutoPostBack, we need to know , what a PostBack
Then, what is AutoPostBack, Autopostback is the mechanism, by which the page will be posted
back to the server automatically based on some events in the web controls. In some of the web controls, the property called auto post back, which if set to true, will send the request to the server when an event happens in the control

For example.

Dropdown Box (Combo box) web control has the property autopostback.If we set the property to true, when ever user selects a different value in the combo box, and event will be fired in the server. i.e. a request will be send to the server.

Why we need to send a request to the server in this case?
Consider this scenario where the web page is used for entering the user information. The page contains two combo box controls State and Town. When user selects the state, the appropriate towns should be filled in the town combo box which is loaded from the database. For achieving this requirement, we can set the autopostback property of state combo box to true. If we do that we can handle the event in the server side and write code to populate the town combo box with the values from the database.

This is how we use the autopostback property. I will give another example for the autopostback usage with another control which will give much better understanding.

Consider a login page, which contains text fields User ID, User Name and Password fields. User name text box will not be editable. So the requirement will be like this, when user enters the user id and clicks tab, his name should be displayed in the User Name text field. For achieving this we have to make autopostback property of the user id textfield to true and handle the event in the server side, In the event handler, we have to write code to fetch the user name from the database for the user id ,which we will be getting from the user id text box.

How it is happening?

Whenever we set autopostback attribute to true in any of the controls, the .net framework will automatically insert few code in to the HTML generated to implement this functionality.

These are the additional items that the framework will inject to the HTML source for implementing autopostback event.

a. A Java script method with name __doPostBack (eventtarget, eventargument)
b. Two Hidden variables with name __EVENTTARGET and __EVENTARGUMENT
c. OnChange JavaScript event to the control


We will discuss one by one of these new entries.


a. __EVENTTARGET and __EVENTARGUMENT

These two controls are added to the HTML source, when ever any autopostback attribute is set to true for any of the web control.

The __EVENTTARGET hidden variable will tell the server ,which control actually does the server side event firing so that the framework can fire the server side event for that control.

The __ EVENTARGUMENT variable is used to provide additional event information if needed by the application, which can be accessed in the server.

b. __doPostBack (eventtarget, eventargument)

Why the framework is inserting this method to the HTML source, and what it really does. This method is inserted to the HTML source to implement the autopostback functionality. This method will submit the form, when ever called. The two parameters in this method i.e. eventtarget and eventargument do the actual work of selecting the control to fire the event.

Eventtarget will contain the name of the control which initiates the post back event, and event arguments will contain the additional parameters needed for the event. (Refer to the previous block).

This method will set the value of the __EVENTTARGET hidden variable with the eventtarget parameter and __ EVENTARGUMENT value with the eventargument parameter.

The next activity is to submit the form, so that in the server side, the framework will check for the name of the control in the __EVENTTARGET hidden variable and will fire the appropriate event.

c. OnChange event.

This event is added by the framework to any of the control where autopostback is set to true, this method will fire the client side OnChange event and calls the __doPostBack event with the name of the control where the OnChange event is happened.

For e.g. If we set autopostback = true to a textfield with id myTextField, then the HTML for the test field will look like this.


name="myTextField" OnChange="__doPostBack(' myTextField ','')" id=" myTextField

So whenever the OnChange event in client occurs, the doPostBack method will be called with the name of the Textfield as the first parameter.

This name will be set to the __EVENTARGUMENT hidden variable by the __doPostBack JavaScript method and the form will be submitted. In the server side the __EVENTARGUMENT hidden variable will be checked and will take the textfield name and the server side event for the same will be fired.

IsPostBack –

When we discuss about autopostback, we should have an understanding of the IsPostBack property of Page class. IsPostBack property is used by the Page to determine whether the page is posted back from the client. If IsPostBack property is false, then the page is loading for the first time, and if false, then the request is because of some event generated by web controls.
IsPostBack is used when we want to load some information when the page loads, for e.g. if we want to load some information from the database and show in the data grid in a page for the first time, then we can load and bind the grid in the page_load when IsPostBack property is false.

Hope this article helps you in understanding Autopostback and IsPostBack.

Cheers!
John