Working with onDesign and onExit events
Our sample projects and report templates can help you learn the basics of working with our products.The viewer and designer can be linked into one edit-and-preview flow: a Design button opens the designer, and Exit returns to the viewer.
Switch component by action. One page serves both, chosen by a query parameter:
How it works. A single script toggles between viewer and designer by query string, so users move seamlessly from preview to editing and back.
Switch component by action. One page serves both, chosen by a query parameter:
if ($action == 'design') {
$component = new StiDesigner();
$component->onExit = 'designerExit';
$component->options->toolbar->showFileMenuExit = true;
}
else {
$component = new StiViewer();
$component->onDesignReport = 'viewerDesign';
$component->options->toolbar->showDesignButton = true;
}
$component->report = $report;function viewerDesign(args) { window.location.href = '?action=design'; }
function designerExit(args) { window.location.href = '?action=view'; }onDesignReport— the viewer's Design button; its handler navigates to the designer page.onExit— the designer's Exit menu item; its handler navigates back to the viewer.
How it works. A single script toggles between viewer and designer by query string, so users move seamlessly from preview to editing and back.