Technote Details :: Errors in browser when transforming old pages into panel states or AJAX widgets files

I am extending an old site, not created with MX AJAX Toolbox. In a file from the site root I create an AJAX panel. For one of the panel states, as the corresponding file, I select an already existing file located in a site folder.

When asked to convert the file, I confirm:

When I preview that state in browser, I get warnings and fatal errors, and the expected content is not displayed.

Also, in a file from the site root I create an AJAX widget with content from external files (accordion, tabset, collapsible region) or a dialog box. As one of the external files I set an already existing file located in a site folder. When I try out the AJAX widget in browser, the region corresponding to the respective file does not function as it should.

The errors are caused by the fact that, inside the panel state file (situated in a site folder and previously created, not generated by MX AJAX Toolbox), the paths to the included .js and .css files (in the head code section), as well as the paths to the required-once files are not given as they should for the AJAX panel to work properly. The paths start with ../, which made perfect sense before adding the panel - the file was inside a site folder, and in order to get to the site root, ../ was needed.

Now that the panel was added and the file was set as a panel state, the request of those files is made through the master page's eye. This means that the paths must be given relatively to the master page. Since the master page (file where the AJAX panel was created) is in the site root, there is no need for the ../ part.

Note: If the panel state file is located on a deeper level in your site (root, first level, second level etc.), the initial paths will start with ../../ (second level), ../../../ (third level) etc. There is no need for this part since the path should be relative to the master page (located in the site root, usually).

In the widgets from file situation (including the AJAX dialog box), the ../ corresponding to the required-once files is still needed, as these external files are executed directly, not through the master one. As for the .js and .css, the path must be transformed relatively to the master page.

To solve the browser errors, make all the file paths inside the panel state file relative to the master page: edit the panel state file and remove the ../ part(or ../../ etc. depending on the site level) at the beginning of the path for the .js, .css, and required-once files.

Note 1: For links (inside the panel state) to other site files to work, follow the same logic - make them relative to the master page.

Note 2: If  here are Dreamweaver forms (record insertion or update ) in the panel state file, editing the redirect link as above will not solve the problem. Please read the How to redirect to another panel state after submitting a form tutorial.

In the widgets from file situation (including the AJAX dialog box), only remove the ../ part in the included .js and .css files paths, but not in the required-once files path.