Quick search:


How to refresh parts of a page using AJAX

Normally, once a page is loaded by the user's browser, only the content of Iframes can be refreshed from the server. WIth AJAX any DOM element that is uniquely identified within the page may be updated from the server.

PhpPeanuts server side implementation of AJAX (version 1.4 and up) can retrieve only user interface parts. The page must already contain DOM elements the parts content can be loaded into by setting innerHTML. It can retrieve several in one request. The resulting updates are identified by the part names, and will update the DOM elements whose ids are equal to the part names, or if a mapping is passed when making the AJAX request, the DOM elements they are mapped to. Example 14 of the tutorial shows how to update the content of a tab using AJAX.

To make an AJAX request you can use the pntAjaxRequest javascript function from general.js. To make it an AJAX request you must specify the parts you want to be updated in a pntAjaxUpd parameter as a comma seperated list witout spaces. An array mapping the requested parts to the DOM elements to be updated may be passed as the third parameter.

By default pages can send AJAX updates for their InformationPart, MainPart, Buttons0 and Buttons1 (these correspond to the first and second rows of buttons). Specific pages may be (made) able to send other parts.

By default Dialogs only send their MainPart. PageParts can be adressed by AJAX requests directly and can send their equally named part (this defaults to the skin that is normally included by PntPagePart printBody. However, this requires that the parts can work independently, most Parts currently can not work without the page that prints them.

PhpPeanuts clientside implementation of AJAX can also update other attibutes of DOM elements. This feature is currenly not used by the serverside implementation.

Currently the default pages can process AJAX requests, but do not send them. You will need to override some of their layout and/or methods to send the AJAX requests. In many cases you will also need to override some of the layout to add the uniquely identified DOM elements to be updated.