How to Redirect to Several Selection Pages Without Refreshing

The Ajax language lets you redirect and display dynamic content in a div container without requiring the user to refresh the page. You can create several div tags to contain several selection pages. The Ajax language is asynchronous, which means the main page does not refresh while Ajax queries and retrieves data from several other pages at one time.

Instructions

1. Right-click the page you want to set up with the Ajax coding. Click "Open With" and select your preferred editor.

2. Create the div containers in which you want to display the content. For instance, the following code creates two containers:

   <div id="div1"> </div>
   <div id="div2"> </div>

3. Create the Ajax code that displays the pages in the div containers. The following code loads pages into the container:

   $('#div1').load('page1.html #div1');
   $('#div2').load('page2.html #div2');

   Replace the HTML pages with the selected pages you want to display in the containers. This code asynchronously loads the pages without refreshing the main HTML page.

4. Save the changes and open the new page in your Web browser to test the new settings.

References

• JQuery: load Function