Click here to Skip to main content
11,568,180 members (35,849 online)
Click here to Skip to main content

Refresh Portion Of Your Web Page Using XMLHTTP

, 15 May 2001 224.3K 3K 56
Rate this:
Please Sign up or sign in to vote.
This article explains how portion of a web page can be selectively refreshed using XMLHTTP
<!-- Download Links --> <!-- Add the rest of your HTML here -->

Introduction

Did you ever have to refresh only selective part of a web page without having to refresh the whole page?. If yes, you are not alone. Fortunately, there are number of solutions which can address this issue, including remote scripting and XMLHTTP. This articles explains how a part of web page can be refreshed by using XMLHTTP, without having to refresh the whole page .

XMLHTTP

XMLHTTP object can be used to make HTTP request from the web browser to the server. XMLHTTP is part of Microsoft's XML parser and it is already installed in your machine if you have Internet Explorer.

Please refer MSDN help on how to use XMLHTTP object. Also, I recommend you reading my article Making HTTP Communication from MFC/Windows Application first, because I use the same techniques here too.

Example

Sample app screenshot

In the above example web page, we can select a country from the country list box. For a country selected, we'll display list of states/province for that country. When you click on a country, a HTTP request to the web server will be send to get all the states for the specific country. States list box will be refreshed with the result from the server. Note that we are not using the submit to send a HTTP request to the web server. Instead, we use XMLHTTP since we do not want the whole page refreshed. Also, note that both request and response are in XML string and we will have to use the XML DOM to read the node values.

If you selected Canada in the country list box, the XML request string which is send from the web browser to the web server will look like below:

<RequestStates Country='Canada'></RequestStates>

The server (i.e. states.asp in this case) will process this request and sends back XML response, which looks like as shown below:

<Response>
	<State>Alberta</State>
	<State>British Columbia</State>
	<State>Ontario</State>
	<State>Quebec</State>
</Response>

The client has to process this XML response and update the states list box. The DisplayStates() function in demo.html takes care of this functionality.

Related Articles

The article Refreshing only part of your Web Page is on the same topic. However, it uses remote scripting (not XMLHTTP) to refresh part of web page.

Installation Notes

Download the sources (states.asp and demo.html) to the root directory of your web server. Note that the sample application assumes that your web server runs on the same machine as the client. If your web server runs on different machine, you have to change the URL name in XMLHTTP's open() method (in demo.html) appropriately. This sample application will not work if the URL specified is wrong.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Share

About the Author

Dhandapani Ammasai(Dan in short) is a software delivery manager at a top tier IT company in India.

You may also be interested in...

Comments and Discussions

 
GeneralPlease use MSXML2.XMLHTTP and MSXML2.DOMDocument Pin
Umut Alev17-Dec-06 21:13
memberUmut Alev17-Dec-06 21:13 
GeneralRefresh Pin
David Pfahl7-Dec-05 12:17
memberDavid Pfahl7-Dec-05 12:17 
GeneralAJAX.net Pin
Sean Rock1-Jul-05 23:47
memberSean Rock1-Jul-05 23:47 
GeneralServer to client transfer Pin
sundarbunny8-Jun-05 22:35
membersundarbunny8-Jun-05 22:35 
GeneralRe: Server to client transfer Pin
Hazem Salem1-Nov-06 10:41
memberHazem Salem1-Nov-06 10:41 
Generaljavascript! Pin
Anonymous27-Sep-04 15:55
sussAnonymous27-Sep-04 15:55 
GeneralRe: javascript! Pin
Alex Korchemniy18-Dec-04 7:35
memberAlex Korchemniy18-Dec-04 7:35 
QuestionXMLHTTP question? Pin
Veddy7-Oct-03 9:53
sussVeddy7-Oct-03 9:53 
Generalsubmit + iframes vs. xmlhttp Pin
Nidi Iacobsohn1-Jun-03 2:27
sussNidi Iacobsohn1-Jun-03 2:27 
GeneralRe: submit + iframes vs. xmlhttp Pin
robpinion21-Jul-03 19:39
memberrobpinion21-Jul-03 19:39 
GeneralRe: submit + iframes vs. xmlhttp Pin
Anonymous13-Oct-05 1:36
sussAnonymous13-Oct-05 1:36 
Generalxmlhttp Pin
arvindsha27-Nov-02 8:46
memberarvindsha27-Nov-02 8:46 
Generalmissing value attribute Pin
9key31-May-02 11:43
member9key31-May-02 11:43 
GeneralGreat piece of code! Pin
Julian Tysoe30-Jan-02 4:56
memberJulian Tysoe30-Jan-02 4:56 
Generalforeing Characters Pin
Hector2-Nov-01 10:50
memberHector2-Nov-01 10:50 
GeneralRe: foreing Characters Pin
Sandro Araújo16-Nov-01 7:27
memberSandro Araújo16-Nov-01 7:27 
QuestionClient requirements? Pin
Tom Archer22-May-01 2:35
memberTom Archer22-May-01 2:35 
AnswerRe: Client requirements? Pin
Gerald22-May-01 6:25
memberGerald22-May-01 6:25 
GeneralRe: Client requirements? Pin
Tom Archer22-May-01 6:47
memberTom Archer22-May-01 6:47 
GeneralRe: Client requirements? Pin
Gerald22-May-01 7:00
memberGerald22-May-01 7:00 
GeneralRe: Client requirements? Pin
Jason Gerard23-May-01 8:42
memberJason Gerard23-May-01 8:42 
GeneralRe: Client requirements? Pin
Dhandapani Ammasai23-May-01 8:46
memberDhandapani Ammasai23-May-01 8:46 
GeneralRe: Client requirements? Pin
WhiteTrailerTrash23-Nov-06 5:11
memberWhiteTrailerTrash23-Nov-06 5:11 
GeneralRe: Client requirements? Pin
Gary Menzel25-Jul-01 13:40
memberGary Menzel25-Jul-01 13:40 
GeneralRe: Client requirements? Pin
Mark Bruk5-Sep-01 15:46
memberMark Bruk5-Sep-01 15:46 

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

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

| Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.150624.2 | Last Updated 16 May 2001
Article Copyright 2001 by Dhandapani Ammasai
Everything else Copyright © CodeProject, 1999-2015
Layout: fixed | fluid