AJAX Dialog Forms

TODO

Document all the components necessary to create a popup dialog using JQueryUI.

Form Markup Requirements

Create separate PHP include file containing the markup for the FORM element that will be inserted into the dialog.

FORM element

Has no parent DIV element.

id="dialog-edit-form"

<form id="dialog-edit-form">
</form>

Contains hidden input storing action property, and optionally record id and content type id.

<input type="hidden" name="<?=P_COMMIT?>" value="1" />
<input type="hidden" name="<?=$input->id->param?>" value="<?=$input->id->value?>" />
<input type="hidden" name="<?=$input->site_section->id->param?>" value="<?=$input->site_section->id->value?>" />

Submit buttons. JavaScript handlers will be assigned to the buttons after the FORM element has been added to the DOM.

• data-tid attribute stores the content type value if it's needed by the JavaScript callback for the button.
• data-op attribute stores the operation when using LITTLED.dialogEdit() or a similar callback for the button.

<div class="submit-container">
	<button class="dlg-commit-btn" data-tid="<?=$input->site_section->id->value?>" data-op="delete">delete</button>
	<button class="dlg-cancel-btn">cancel</button>
</div>

AJAX Handler Script

The text displayed as the title of the dialog is passed back as the value of $json->label->value.

Editing records

Overview

• Specify handler with Sections CMS > Edit URI setting
• Create an include file containing the form markup and place it in _templates/forms/ in the content type's CMS directory.
• Add the content type of the cache_class.
• Update necessary cache_class routines.

Generic AJAX handler script

• [COMMON_LIB]_ajax/utils/edit_record.php
• Specify handler with Sections CMS > Edit URI setting
• Define handler in cache_class::load_json_content()
  • Include the content type and optionally its corresponding filter class.
  • Within the load_json_content() routine create a case for the content type and the 'edit' operation.
  • Define any necessary logic in the content class's save() routine.